How to return a `forkJoin` observable when piping the operators

Question

Before I had this resolver that just worked fine:

resolve() {
    return forkJoin(
        this.getData1(),
        this.getData2(),
        this.getData3()
    );
}

Now I have to do something like that which is actually does not work:

  resolve() {
    return this.actions$
      .pipe(
        ofActionSuccessful(SomeSctonSuccess),
        forkJoin(
           this.getData1(),
           this.getData2(),
           this.getData3()
        )
      );
    }

as I am hitting this error:

Argument of type 'Observable<[any, any, any, any]>' is not assignable to parameter of type 'OperatorFunction'. Type 'Observable<[any, any, any, any]>' provides no match for the signature '(source: Observable): Observable'.

Any ideas how to fix?

Now I heed to return my forkJoin only after ofActionSuccessful(SomeSctonSuccess) is taking place https://ngxs.gitbook.io/ngxs/advanced/action-handlers

https://github.com/SrgSprinkles/AngularWeatherApp/blob/21c167e6ee0c6a29408c30d8d87def63312efb05/src/app/home/effects/dashboard.effects.ts — Sajeetharan, May 29 '18 at 03:09
@Sajeetharan Thanks for pointing out to the right direction. But now after using the `exhaustMap` my component `ngOnInit` and `constructore` stop getting called? any thoughts? — Abrkad, May 29 '18 at 03:37

score 4 · Answer 1 · edited Aug 14 '19 at 09:19

4

Use exhaustMap operator. It maps to inner observable, ignore other values until that observable completes

import { forkJoin } from 'rxjs';
import { exhaustMap } from 'rxjs/operators';

resolve() {
    return this.actions$
      .pipe(
        ofActionSuccessful(SomeSctonSuccess),
        exhaustMap(() => {
         return forkJoin(
             this.getData1(),
             this.getData2(),
             this.getData3()
           )
       })

      );
    }

edited Aug 14 '19 at 09:19

Stefan Falk

23,898
50
191
378

answered May 29 '18 at 03:22

Ritwick Dey

18,464
3
24
37

that is what comment was reverencing to, I've got that by looking in to related url – Abrkad May 29 '18 at 03:24

score 2 · Answer 2 · answered May 29 '18 at 03:22

Thanks to @Sajeetharan by looking to this url ended up using exhaustMap

  resolve() {
    return this.actions$.pipe(
      ofActionSuccessful(LoadOnPremHostSuccess),
      exhaustMap(() => {
        return forkJoin(
          this.getData1(),
           this.getData2(),
           this.getData3()
        );
      })
    );

}

How to return a `forkJoin` observable when piping the operators

2 Answers2

Linked