angularrxjsangular13rxjs7

How to avoid HTTP call from chained angular subscription


I have a situation where I call an HTTP service to get data back, then based on that data I need to immediately make another HTTP call. Normally I'd pipe the first output to a switchMap and be done. That is now being done from inside a route subscription, so I'm not seeing how to get rid of the inner call.

this.route.queryParamMap
  .pipe(switchMap(params => someService.get(params))
  .subscribe(x => {
    // do other things with x

    someService.getOtherThing(x.id).subscribe(...)
  })

I can't call getOtherThing(x.id) until the get(params) call completes. How do I avoid that service call from within the subscription?


Solution

  • this.route.queryParamMap.pipe(
      switchMap(params => someService.get(params)),
      concatMap((x) => {
        // do other things with x
        return someService.getOtherThing(x.id)
      })
    ).subscribe((response) => console.log('Your response'));
    

    concatMap will wait for someService.get(params) to be completed in order to trigger someService.getOtherThing(x.id)