Angular 7 – nesting Observables

by

We can make use of pipeable RxJS operators for this scenario.

First, we can use RxJS’s mergeMap to map over the observable values from route into an inner observable. If params and params['client_name'] are defined, we assign params['client_name'] to the client_name property, which is similar to your initial code. Then, we call the getClientDetails() method from dataService. If the params do not exist, we convert null into an observable, and return it.

Subsequently, the observables are returned in .subscribe() block. From there, we can assign the response to the client property.

import { mergeMap } from 'rxjs/operators';
import { of } from 'rxjs';
.
.
this.route.params.pipe(
  mergeMap(params => {
    if (params && params['client_name']) {
      this.client_name = params['client_name'];
      return this.dataService.getClientDetails(this.client_name);
    } else {
      return of(null)
    }
  })
).subscribe(response => {
  // handle the rest
  this.client = response;
})

More Related Contents:

  1. Angular/RxJS When should I unsubscribe from `Subscription`
  2. Observable type error: cannot read property of undefined
  3. How to create an RXjs RetryWhen with delay and limit on tries
  4. TypeError: You provided an invalid object where a stream was expected. You can provide an Observable, Promise, Array, or Iterable
  5. fromPromise does not exist on type Observable
  6. How to return observable from subscribe
  7. How to return value inside subscribe Angular 4
  8. Delegation: EventEmitter or Observable in Angular
  9. What is the difference between Promises and Observables?
  10. Angular HTTP GET with TypeScript error http.get(…).map is not a function in [null]
  11. Avoiding nesting subscriptions in Angular 2+?
  12. Angular 2 – Return data directly from an Observable
  13. take(1) vs first()
  14. Chaining RxJS Observables from http data in Angular2 with TypeScript
  15. RxJS: takeUntil() Angular component’s ngOnDestroy()
  16. Angular Subscribe within Subscribe
  17. Wait for Angular 2 to load/resolve model before rendering view/template
  18. Handling refresh tokens using rxjs
  19. Creating and returning Observable from Angular 2 Service
  20. How to make a sequence of http requests in Angular 6 using RxJS
  21. Angular subscribe elegant
  22. Angular – Make multiple HTTP calls sequentially
  23. Rxjs Retry with Delay function
  24. Merging http observables using forkjoin
  25. tap() isn’t triggered in RXJS Pipe
  26. Subscribing to a nested Observable
  27. Property ‘toPromise’ does not exist on type ‘Observable’
  28. Do I need to `complete()` takeUntil Subject inside ngOnDestroy?
  29. How to send 1000 XHTTP Requests with maximum number of parallel requests
  30. Do we need to unsubscribe from observable that completes/errors-out?

Leave a Comment