2016-12-05 1 views
0

ngrx/store를 사용하도록 앱을 업데이트하고 있지만 경로 매개 변수로 작동시키는 방법을 알아낼 수 없습니다.경로 매개 변수가있는 Angular2 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월 6일는) 완전히 내가 원하는 것을 제공하지 않았기 때문에

나는, FunStuff's answer에 확장 an answer을 추가했다. 나는이 문제를 다루는 더 좋은 방법이 있다고 생각하기 때문에 두 가지 대답 중 하나를 받아들이지 않았다.

제 질문을 명확히하기 위해 this.itemObservable 인 방식으로이 작업을 수행하려고합니다.

답변

3

Rx combinelatest을 사용할 수 있습니다.

는 관찰 서열 어느가 요소를 생성 할 때마다 선택 기능을 이용하여 관찰 한 시퀀스 로 지정된 관찰 서열을 병합.

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; 
     }); 
    }); 
} 

내가 '구성 요소 아무튼 이후이 더 좋아 생각을 Store에 대해 전혀 알 필요가 없으며 Observables을 결합 할 필요가 없습니다.

관련 문제