RxJs ¿Observables suscripciones anidadas?

subscribe

Question

¿Cuál es la manera de simplificar algo como el siguiente ejemplo de código? No puedo encontrar el operador correcto ... ¿alguien podría dar un breve ejemplo?

this.returnsObservable1(...)
  .subscribe(

    success => {

      this.returnsObservable2(...)
        .subscribe(

          success => {

            this.returnsObservable3(...)
              .subscribe(

                success => {
                   ...
                },

Answer 1

Como se mencionó en los comentarios, está buscando el operador flatMap .

Puede encontrar más detalles en respuestas anteriores:

• Cómo hacer la secuencia de la cadena en rxjs
• ¿Por qué necesitamos usar flatMap?

Su ejemplo se leería como:

this.returnsObservable1(...)
  .flatMap(success => this.returnsObservable2(...))
  .flatMap(success => this.returnsObservable3(...))
  .subscribe(success => {(...)}); 

Answer 2

El operador switchMap también puede ser útil. Aquí se pueden encontrar algunos ejemplos que describen la utilidad de switchMap en comparación con las suscripciones anidadas:

1. situación con suscripciones anidadas

Este codepen ofrece una demostración: https://codepen.io/anon/pen/zdXBvP?editors=1111

Rx.Observable
  .interval(5000)
  .subscribe((val) => {
    console.log("outer:", val);
    Rx.Observable
      .interval(1000)
      .subscribe((ival) => {
        console.log("inner:", val, ival); 
      });
  });

2. situación con switchMap

Este codepen ofrece una demostración: https://codepen.io/anon/pen/xLeOZW?editors=1111

Rx.Observable
  .interval(5000)
  .switchMap((val) => {
    console.log("outer:", val);
    return Rx.Observable.interval(1000).map((ival) => [val, ival]);
  })
  .subscribe((val) => {
    console.log("inner:", val[0], val[1]);
  });

Answer 3

Respondí previamente para RxJS 5, terminé en esta página mientras usaba 6.

En el caso de que también esté en 6 (y creo que ya debería estarlo), puede usar flatmap como operator dentro de pipe .

Modificó el código de ejemplo de @ user3743222:

this.returnsObservable1(...)
  .pipe(
    flatMap(success => this.returnsObservable2(...)),
    flatMap(success => this.returnsObservable3(...))
  )
  .subscribe(success => {(...)});