하나의 효과에서 여러 작업 발송

Question

안녕하세요 저는 "loadFullService $"효과에서 새로운 작업 "LoadConfig"를 보내고 싶습니다.

하는 방법? 생성자에서

@Effect() 
loadFullService$: Observable<Action> = this.actions$ 
    .ofType<servicesActions.LoadFullService>(servicesActions.LOAD_FULL_SERVICE) 
    .switchMap(action => { 
     return this.apiService 
      .loadFullService(action.payload) 
      .map((service: Service) => new servicesActions.LoadFullServiceSuccess(service)) 
      .catch(error => of(new servicesActions.LoadFailureAction(error))); 
    }) 
    ; 

@Effect() 
loadConfig$: Observable<Action> = this.actions$ 
    .ofType<servicesActions.LoadConfig>(servicesActions.LOAD_CONFIG) 
    .switchMap(action => { 
     console.log("action config", action); 
     return this.apiService 
      .loadConfig(action.id, action.name) 
      .map((config: Configuration) => new servicesActions.LoadConfigSuccess(config)) 
      .catch(error => of(new servicesActions.LoadConfigFailure(error))); 
    }); 

들으 유

Answer 1

가져 오기 스토어 서비스를 제공합니다.

constructor(
    private store: Store<StoreType>, 
) 

그리고 어느 곳에서나 ofType() 후 do 연산자 (보통)와 액션 호출 this.store.dispatch(newAction), 내부.

@Effect() 
 
loadFullService$: Observable<Action> = this.actions$ 
 
    .ofType<servicesActions.LoadFullService>(servicesActions.LOAD_FULL_SERVICE) 
 
    .do(action => { 
 
    this.store.dispatch(new servicesActions.LoadConfig(action.payload.id, action.payload.name)) 
 
    }) 
 
    .switchMap(action => { 
 
    return this.apiService 
 
     .loadFullService(action.payload) 
 
     .map((service: Service) => new servicesActions.LoadFullServiceSuccess(service)) 
 
     .catch(error => of(new servicesActions.LoadFailureAction(error))); 
 
    });

내가 좋아하는 데 사용되는 또 다른 일반적인 접근은 새로운 관찰을 만들고있다 : 단점은

@Effect() 
 
loadFullService$: Observable<Action> = this.actions$ 
 
    .ofType<servicesActions.LoadFullService>(servicesActions.LOAD_FULL_SERVICE) 
 
    .switchMap(action => { 
 
    return this.apiService 
 
     .loadFullService(action.payload) 
 
     .mergeMap((service: Service) => { 
 
     return new Observable(observer => { 
 
      const successAction = new servicesActions.LoadFullServiceSuccess(service)); 
 
      const newAction = new servicesActions.LoadConfig(action.id, successAction.name)); 
 
      observer.next(successAction); 
 
      observer.next(newAction); 
 
      observer.complete(); 
 
     }); 
 
    }) 
 
    .catch(error => of(new servicesActions.LoadFailureAction(error))); 
 
});

이 더 이탈을 추가하는 그리고 코드를 따라 가면 때때로 더 힘들어집니다. 마지막으로

, 세 번째 방법 :

내가 노력

@Effect() 
 
loadFullService$: Observable<Action> = this.actions$ 
 
    .ofType<servicesActions.LoadFullService>(servicesActions.LOAD_FULL_SERVICE) 
 
    .switchMap(action => { 
 
    return this.apiService 
 
     .loadFullService(action.payload) 
 
     .mergeMap((service: Service) => { 
 
     const successAction = new servicesActions.LoadFullServiceSuccess(service)); 
 
     const newAction = new servicesActions.LoadConfig(action.id, successAction.name)); 
 
     return Observable.from([successAction, newAction]); 
 
     }) 
 
     .catch(error => of(new servicesActions.LoadFailureAction(error))); 
 
    });