How to avoid HTTP call from chained angular subscription

Question

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?

Answer 1

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)