2016-03-19 36 views
1

Gözlerimi gözlemlenebilir ve gözlemci (rxjs) etrafında alamıyorum, gözlemlenebilirlerin gözlemcileri gözlemciye gönderebileceğini ve gözlemcinin gözlemlenebilir olarak abone olabileceğini anlıyorum, ancak bunu nasıl kuracağımı bilmiyorum.rxjs - gözlemlenebilir ve gözlemciyi anlayın

URL'yi istemeyi, ilk defa "loadData" aramasını istediğimi, verilerin http isteği ile yüklendiğini ve kullanıcının "loadData" adlı bir sonraki seferinde yerel olarak kaydedileceğini söyleyelim http'den yükle, ancak verileri yerel olarak al, ama aynı kodu "loadData" kullanmak istiyorum ve Observer'ı geri döndürmeli, böylece geliştirilmiş olan nerede ve nasıl yüklendiğini bilmiyorum!

let data = []; 
function loadData():Observer { 
    var observer = new Observer(); 
    if (data.length > 0) { 
     var observable = new Observable.from(data); 
     observable.add(observer); 
     observable.notify(); 
    } else { 
     var observable = this.http.get("data.json"); 
     observable.add(observer); 
     observable.readyData((data) => { 
     this.data = data; 
     observable.notify(); 
     }; 
    } 
} 

var observer = loadData(); 
observer.dataComing((data) => console.log(data)); 

herhangi bir sayfaya dair bir açıklamanız veya bağlantı çok iyi olurdu, ben filtre Array vb azaltmak harita anlamak ve ayrıca hangi gözlemci desen kolaydır, ancak RXJS şekilde, çok kafa karıştırıcı!

Çok teşekkür ederim! Gözlemci bir olayı güdülemek için kullanılır ve kısa içinde almak için gözlemlenebilir olduğu

var observe = Observable.create((observer) => { 
    setTimeout(() => { 
    observer.next('some event'); 
    }, 1000); 
}); 

obs.subscribe((event) => { 
    // The event is received here 
}); 

: Burada

+0

Çaylaklar, bir bakın [gözlemci] için Rx belgelerinde (https://github.com/ReactiveX/rxjs/blob/master/doc/observer.md) ve [gözlenebilir] (https://github.com/ReactiveX/rxjs/blob/ ana/doc/observable.md). Oldukça basit ve kapsamlı. – Stanislasdrg

cevap

2

gözlemcinin örnek/gözlemlenebilir. Çoğu zaman, gözlemci aralıklı olarak kullanılır. Angular2

HTTP desteğiyle Örneğin İşte

reaktif programlama ile ilgili bazı bağlantılar: Özellikle çantasının kullanılması sizin için

, bu kullanabilirsiniz:

Düzenleme

Ben kodunuzu bu şekilde refactor olacaktır: Başvurunuzu işe koşulması zaman LoungesService paylaşılan hizmet olarak tanımlanması gerektiğini

@Injectable() 
export class LoungesService { 
    constructor(private http:Http) { 
    this.loungesByCity = {}; 
    } 

    getLoungesByCity(city:City):Observable<any> { 
    if (this.loungesByCity && this.loungesByCity[city.id]) { 
     return Observable.of(this. loungesByCity[city.id]); 
    } else { 
     return this.http.get("lounges.json") 
      .map(res => <Lounge[]> res.json().data) 
      .map((lounges) => { 
      return lounges.filter((lounge) => lounge.city_id === city.id); 
      }) 
      .do(data => this.loungesByCity[city.id] = data); 
    } 
} 

Not: soruya

bootstrap(AppComponent, [ LoungesService ]); 
+0

Veriler hazır değilse ne olur? Lütfen kontrol edin: https://jsbin.com/daxayuwinu/1/edit?js –

+0

Kodunuzu bu şekilde güncellerim. Güncelleştirme yanıtımıma bakın ... –

+0

Teşekkür ederim, yöntemi kullanarak bileşeni göstermek için kodu güncelledim, ancak ngOnInit bileşenindeki abone Verileri almıyor. –

İlgili konular