Angular2 ngrx/store с параметрами маршрута

Я обновляю приложение для использования ngrx/store, но не могу понять, как заставить его работать с параметрами маршрута.

В настоящее время я просто использую 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/06):

Я добавил ответ, чтобы расширить ответ FunStuff, так как он не предоставил полностью то, что я хочу. Я не принял ни одного ответа, так как думаю, что, вероятно, есть лучший способ справиться с этим.

Чтобы уточнить мой вопрос, я пытаюсь сделать эту работу таким образом, чтобы this.item является Observable,

2 ответа

Вы можете использовать Rx combinest.

Объединяет указанные наблюдаемые последовательности в одну наблюдаемую последовательность с помощью функции селектора всякий раз, когда любая из наблюдаемых последовательностей производит элемент.

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

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

Благодаря ответу FunStuff я получил правильное направление, но он не полностью ответил, как использовать combineLatest() по отношению к компоненту Angular2.

Вот решение, которое я придумал, которое позволяет вам установить 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;
        });
    });
}

Я думаю, что мне это нравится больше, так как компонент не должен знать о Store на всех, и это позволяет избежать необходимости сочетать Observables,

Другие вопросы по тегам