2017-11-26 3 views
3

私は、そのデータをストアに加入させるコンポーネントを持っています。ngrx/storeの登録を解除するには?

this.store.select('somedata').subscribe((state: any) => { 
    this.somedata = state.data; 
}); 

、私はいくつかの観測可能に加入しています他の場所では、このような何か、コンポーネントはこれ以上の場合に、このサブスクリプションの購読を解除しないようにしたい:

this.service.data.subscribe(
    (result: any) => {//data} 
); 

が、私はこのように、ngOnOnDestroyでそれを退会:

ngOnDestroy(){ 
    this.service.data.unsubscribe(); 
} 

しかし、店の場合には、私がすることはできませんよ

は、それは私にエラーを与えますあなたが最初の場所での使用 | asyncに加入する必要はありません3210
Property 'unsubscribe' does not exist on type 'Store<State>' 

答えて

6

あなたは、あなたがそれにサブスクリプションオブジェクトを受け取ります購読すると、あなたが(退会を呼び出すことができます)

const subscription = this.store.select('somedata').subscribe((state: any) => { 
    this.somedata = state.data; 
}); 
// later 
subscription.unsubscribe(); 

または

ngOnInit(){ 
this.someDataSubscription = this.store.select('somedata').subscribe((state: any) => { 
    this.somedata = state.data; 
}); 
} 

ngOnDestroy(){ 
    this.someDataSubscription.unsubscribe(); 
} 
3

あなたのテンプレート。 店舗から得られるものはすべて監視可能です。ここ あなたは私たちが値を取得するための非同期パイプを使用している。ここ

@Component({ 
    template: ` 
     <div>Current Count: {{ counter | async }}</div> 
    ` 
}) 
class MyAppComponent { 
    counter: Observable<number>; 

    constructor(private store: Store<AppState>){ 
     this.counter = store.select('counter'); 
    } 
} 

のような非同期パイプで値を取得し、直接メソッドを購読呼び出すことなく、値を取得することができますapi

3

です。 非同期パイプはObservableまたはPromiseにサブスクライブし、発行した最新の値を返します。新しい値が発行されると、非同期パイプは変更があるかどうかをチェックするコンポーネントをマークします。コンポーネントが破棄されると、非同期パイプは自動的にサブスクリプションを解除し、潜在的なメモリリークを回避します。

関連する問題