Search code examples
rxjsrxjs-pipeable-operators

How to pass action data downstream a pipeable operator stream in rxjs?


I have a situation where I want to access action payload in a third level operation. I was able to such thing in lettable operators but how can I do the same with pipeable operator?

this my code,

 @Effect()
  onTrySignin = this.actions$.pipe(
    ofType(AuthActions.TRY_SIGNIN),
    map((action: AuthActions.TrySignin) => {
      return action.payload;
    }),
    switchMap(action => {
      return this.httpService
        .postRequest('UserAccounts/Login', action.credentials);
    }), catchError((error: HttpErrorResponse) => {
      return Observable.of(new AuthActions.FailedAuth(error));
    }),
    mergeMap((response: any) => {
      // how to access action payload here?
    })
  );

Solution

  • You can use map() to pass data along an observable chain like this:

    // both foo and bar will be available on next()
    from(AsyncFooData()).pipe(
      concatMap(foo => AsyncBarData().pipe(
        map(bar => ({foo, bar})
      )),
      tap(val => console.log(val), // chain more operators here...
    ).subscribe(({foo, bar}) => {
      // do stuff with foo and bar
    })
    

    FWIW, I took this answer from this question where I posted a somewhat similar answer.