2016-12-08 5 views
1

Angular2/RXJSのオブザーバブルは、サブスクリプションされたときの動作を一般的に理解していますが、どこかで間違いをしています。私のサービスで Angular2コンポーネントのサブスクリプションが正しくない実装

は、私が観測可能なので、のようにあります。

// Source 
    private objectDetailsCache = new Subject<ObectDetails>(); 
    // Stream 
    public objectDetails$ = this.objectDetailsCache.asObservable().cache(); 

サービスは、これらの方法で観察操作:

updateObject(object: ObjectDetails): Observable<ObjectDetails> { 

    let objectMapped = this.mappingService.mapObjectDetailsToObject(object); 

    this._HTTPService.update(this._objectUrl + object.id, objectMapped) 
     .subscribe(o => { 
      this.objectDetailsCache.next(o); 
     }); 
    return this.objectDetails$.last(); 
    } 

    getObjectDetails(id: number): Observable<ObjectDetails> { 
    this._HTTPService.get(this._objectUrl + id + '/details') 
     .subscribe(o => { 
      this.objectDetailsCache.next(o); 
     }) 
    return this.objectDetails$.last(); 
    } 

私が観察し、トラックにサブスクライブする親コンポーネントを持っていますその子供たちによってなされた変更

constructor(private objectService: ObjectService) { 
    objectService.objectDetails$.subscribe(o => this.object = o); 
} 

次に、 mponentはアプリケーションにどのオブジェクトを観察したいかを伝えます。

ngOnInit() { 
     this.loadObjectDetails(); 
    } 

    loadObjectDetails() { 
     this.sub = this.route.params.subscribe(params => { 
      let id = +params['id']; 
      this.objectService.getObjectDetails(id) 
       .subscribe(
       o => { }, 
       error => { }); 
     }); 
    } 

これまでのところすべて問題ありません。

ngOnInit() { 
     this.sub = this.objectService.objectDetails$.subscribe(
      o => { 
       this.object = o; 
       this.getHeaders() 
      } 
     ); 
    } 

    ngOnDestroy(){ 
     this.sub.unsubscribe(); 
    } 

親はそれが観察されたオブジェクトを変更し、子供がちょうど最後のではなく、以前に観察されているすべてのオブジェクトにヒットする:子コンポーネントが観測親のオブジェクトをサブスクライブするときに問題が来ます。したがって、この子の場合、親が3つのオブジェクトを観察した場合、this.getHeaders()は子がサブスクライブするときに3回呼び出されます。

私は、サブスクリプションの完全な部分に子メソッドを移動しようとしました:

() => this.getHeaders() 

それがヒットれることは決してありません。

私は親サブスクリプションをngOnInit()に入れて、ngDestroy()でサブスクライブしませんでしたが、そのようなものをサブスクライブすることはできませんでした。

私がこれについてどうやって調整するかについての提案はすばらしいでしょう。

これは意味があることを願っています。ありがとうございます。

+0

コンストラクタまたはngInitに値があるかどうかわかりません....私が行ってきたことは、Observableを返すメソッドGetMyObservable()を作成して、そのメソッドを購読することです。魅力のように働く。それがあなたの問題かどうかわからない。 –

+0

アドバイスをいただきありがとうございますジョン、それは私が仕事を購読するようだが、私は実際にサブスクリプションを望んでいない。私は、私に観測可能なもののスナップショットを与えるために何か必要があると思う。 – Mark

答えて

0

私はRXJSライブラリからBehviourSubjectを使用して問題がラウンドを取得することができました:

https://xgrommx.github.io/rx-book/content/subjects/behavior_subject/index.html

特に以降.getvalue()メンバーが観測ストリーム内の最後のオブジェクトを返します。したがって、子コンポーネントにオブザーバブルをサブスクライブするのではなく、最新の値を要求するだけです。このようにして観測可能な蒸気を更新するとき、彼らは自分自身をリサイクルしません。

関連する問題