2016-12-05 12 views
0

ngrx/storeを使用するようにアプリケーションをアップデートしていますが、ルートパラメータで動作させる方法がわかりません。Angular2 ngrx/store with route parameters

現在のところ、私はActivatedRouteを使用しており、this.route.paramsを使用しています。私のコンポーネントのngOnInit()です。だからこのような何か:

ngOnInit(): void { 
    this.route.params 
     .switchMap((params: Params) => { 
     return this.item_service.get(params['item_id']) 
     }) 
     .subscribe((item) => { 
     this.item = item; 
     }); 
} 

私はngrx/storeを使用しているので、私は店のために観察可能なものを使う必要があります。基本的に私はこのようなことを達成しようとしています:

this.item = this.store.select('item').filter((item: Item) => { 
    return item.id == magically_obtained_params['item_id']; 
}); 

この方法を作る方法はありますか?


アップデート(2016年12月6日):

私はそれは完全に私が欲しいものを提供しなかったことから、FunStuff's answerに展開するan answerを追加しました。私はこれに対処するより良い方法があると思うので、どちらの回答も受け入れていません。

私の質問を明確にするために、私はthis.itemObservableであるようにこの仕事をしようとしています。

答えて

3

Rx combinelatestを使用できます。

は観察 配列の任意要素を生成するたびに、セレクタ機能を用いて1つの観察シーケンス に指定された観察シーケンスをマージします。

this.item = Rx.Observable.combineLatest(
    this.store.select('item'), 
    this.route.params 
); 

this.item.subscribe([item, params] => { 
    return item.id == params['item_id']; 
}); 
1

私は正しい方向にFunStuff's answerへの感謝を指摘しましたが、それは完全にAngular2コンポーネントに関連してcombineLatest()を使用する方法を答えませんでした。ここで

は、私はそれはあなたがコンポーネント上 Observableプロパティを設定することができます思い付いたソリューションです:

ngOnInit(): void { 
    this.item = Observable.combineLatest(
     this.store.select('item'), 
     this.route.params 
    ).switchMap(function(items, params) { 
     return items.filter((item) => { 
      return item.id == params['item_id']; 
     }) 
    }); 
} 

これは動作しますが、私の場合のために、私はさらに一歩行くことにしました。 combineLatest()を使用する代わりに、switchMap()のフィルタロジックを代わりに私のサービスに移しました。私はこのようなメソッドを持って

ngOnInit(): void { 
    this.route.params.subscribe((params: Params) => { 
     this.item = this.item_service.getItem(params['item_id']); 
    }); 
} 

そして、私のサービス上:この実装では

、私のコンポーネントは、その後のように見えた

getItem(item_id: string): Observable<{}> { 
    return this.store.select('item').switchMap((items: any) => { 
     return items.filter((item: any) => { 
      return item.id == item_id; 
     }); 
    }); 
} 

私は部品が「doesnのため、私はこれよりよくしたいと考えてStoreについて知る必要があり、Observablesを組み合わせる必要はありません。