-1

I am building a resolver that is used when my app loads initially. I need to run several HTTP requests, which can be run at the same time (hence using forkJoin). But there are a few that need to be chained once the forkJoin is completed. What would be the best way to accomplish this? I tried using mergeMap as follows:

  resolve(): Observable<any> {
return forkJoin([
  this.dataService.getUser(),
  this.dataService.getSummary()
]).mergeMap((data) => {
  return this.dataService.listDetails(data[1]);
});

}

However, I get the following error:

    ERROR Error: Uncaught (in promise): TypeError: (0 , rxjs__WEBPACK_IMPORTED_MODULE_1__.forkJoin)(...).mergeMap is not a function
TypeError: (0 , rxjs__WEBPACK_IMPORTED_MODULE_1__.forkJoin)(...).mergeMap is not a function
ts1993
  • 107
  • 2
  • 12

1 Answers1

1

mergeMap is an operator. These need to be used inside the pipe method:

  resolve(): Observable<any> {
    return forkJoin([
      this.dataService.getUser(),
      this.dataService.getSummary()
    ]).pipe(mergeMap((data) => {
      return this.dataService.listDetails(data[1]);
    }));
  }
Timothy L Gillespie
  • 420
  • 3
  • 8
  • I seem to be getting closer, however, I am unable to access the data returned by the first two requests in the forkJoin. I am accessing data via this.route.snapshot.data, but it only seems to include data from the last request. Any ideas? – ts1993 Aug 23 '22 at 19:18
  • I don't think I can answer that question with the given information. `this.route.snapshot.data` seems entirely unrelated to the Observable. Perhaps your issue is right there? – Timothy L Gillespie Aug 23 '22 at 19:29
  • That is how I am accessing the data from the resolver, in the component in which I am routing to. The resolve method above is located in the InitialResolver, which is referenced in the route below. In BaseComponent, I am trying to access the data from the resolver. ` {path: "", component: BaseComponent, resolve: { data: InitialResolver }, },` – ts1993 Aug 23 '22 at 19:38