2016-07-14 24 views
5

Bu yüzden Angular 2 ile programlama yapmaya yeni başladım ve daha yeni abone, Subject ve BehaviorSubject hakkında bilgi almaya başladım. Şu anda servisimde saklanan ve bir bileşene gönderilen değerleri almak için birden çok aboneliğim var. Benim uygulama işlerim var ama hepsini biliyorum çok verimsiz.Birden çok Gözlenebilir'i birlikte birleştirmek için Angular 2

this.threatService.minLimitChange$.subscribe(min => { this.min = min; this.getSession();}); 
this.threatService.maxLimitChange$.subscribe(max => { this.max = max; this.getSession();}); 

(ve bu gibi işlev getSession(), her zaman tek bir değer elde eder ve aramaları daha fazla başka 5) zaman threat.service olarak

:

benim bileşeninde yandan dışarı kazanılmış O
private minLimitChangeSource = new BehaviorSubject<number>(this.min); 
private maxLimitChangeSource = new BehaviorSubject<number>(this.max); 
minLimitChange$ = this.minLimitChangeSource.asObservable(); 
maxLimitChange$ = this.maxLimitChangeSource.asObservable(); 

yüzden denedim: amacım sadece res yaradığını test etmekti

this.threatService.minLimitChange$.concat(this.threatService.maxLimitChange$).subscribe(res => console.log(res)); 

çünkü iki değere nasıl erişeceğimi bilmiyordum ... ama bunu konsolumda alıyorum. ;/

TypeError: this.threatService.minLimitChange$.merge is not a function. (In 'this.threatService.minLimitChange$.concat(this.threatService.maxLimitChange$)', 'this.threatService.minLimitChange$.concat' is undefined) 

Sonuçta, ben getSession() benim hizmetinden ihtiyacı olan tüm değerleri almak ve bu fonksiyonu kez çalıştırmak istiyorum. Aboneliklerimi birleştirmek için lütfen concat, merge veya forkJoin'i kullanma konusunda herhangi bir yardım veya açıklama için minnettarım. Teşekkür ederim!

cevap

10

Sen birine 2 gözlemlenebilir akışları birleştirmek Observable.combineLatest kullanabilirsiniz:

combineObs = obs1.combineLatest(obs2, 
    (val1, val2) => { 
    return {val1: val1, val2: val2}; 
    }); 

Çalışma plunker: http://plnkr.co/edit/mmCzEmdKexpaWNM53me9?p=preview

+0

Anlıyorum! Ancak, istediğim şeye yakın görünüyor, değerleri html'deki {{}} yöntemiyle kullanmıyorum. Uygulamam aslında veri bileşenlerini UI bileşenindeki kaydırıcıya göre gösteren bir grafik üretecidir. Böylece veri akışı: ** UI Bileşeni ** içindeki kaydırıcı ** ve min değerleri gönderir> ** Hizmet ** abone olarak yayınlar ve yayınlar> ** Grafik Bileşeni ** bu değerlerle bir işlev çalıştırır. Bu nedenle, birleştirme bileşenini grafik bileşenime yerleştirirsem, bileşenin maksimum ve min değerlerine yerel olarak nasıl atayabilirim? – mshantic

+0

Hey ekli plnkr bağlantısını kontrol et. Temel olarak fikir, görevinizi 2 adımda gerçekleştirmektir: 1. İki akışı bir araya getirin, üçüncü akış, kaynak akışının her ikisi de yeni bir değere sahip olduğunda yeni bir değer yayar; 2. Birleştirilmiş akışı dinleyin ve yerel verilerinizi birleştirilmiş verilere göre doldurun. İkisini de plnkr'de gösterdim. –

+1

Teşekkür ederiz! Satırlarda çalışıyor ve çok fazla kodun üzerine basıyor. Ayarlar gibi bir sınıfa sahip olmadığım için ayrı bir hizmet ve ana bir bileşime sahip olduğumdan ve işlevler ve değişkenler plunker'ınız gibi birlikte olmadığından kaybolmuştum. Ama şimdi anlıyorum (: Tekrar teşekkürler! – mshantic