typescript - promesas - que es subscribe en angular

mecanografiado-esperar que un observable/promesa termine y regresar observable

Question

Soy completamente nuevo en Typescript y RxJS, e intento devolver un observable luego de que se termine otro observable:

public myObservable = () : Observable<boolean> =>{
    console.log(''retrieving the token in DB'');
    return Observable.create(observer => {
        setTimeout(() => {
            observer.next(true);
            observer.complete();
        }, 5000);
    });
}

public makeRequest = (): Observable<any> => {
    return this.myObservable().subscribe(
        function (x) {
            console.log(''I have the token, now I can make the HTTP call'');

            return this.http.get(''http://jsonplaceholder.typicode.com/posts/1'')
                .map( (responseData) => {
                    return responseData.json();
                })
                .map((item:any) => {
                    return {
                        id: item.id,
                        userId: item.userId,
                        title: item.title,
                        body: item.body
                    };
                });

        },
        function (err) {
            console.error(''Error: '' + err);
        },
        function () {
            console.log(''Completed'');
        });

}

Tengo el error: "La suscripción del tipo de expresión devuelta no es asignable para escribir Observable<any> ".

Entiendo totalmente el error aquí (un Observable es como un flujo, y una suscripción es el hecho de "observar" ese flujo) , pero no veo cómo "esperar" que un observable (o una promesa) termine devolver un observable ...

Answer 1

El problema es que convertimos observables en tipos diferentes ... con .subscribe , mientras que no deberíamos (no se vuelve observable)

public makeRequest = (): Observable<any> => {
    return this.myObservable().subscribe(
      ... // this is wrong, we cannot return .subscribe
          // because it consumes observable and returns ISusbcriber
    );
}

Cuando tenemos un observable ... deberíamos tomar su resultado y usar .map para convertirlo en algo más

Operador FlatMap

transforma los elementos emitidos por un Observable en Observables, luego aplana las emisiones de esos en un solo Observable

public makeRequest = (): Observable<any> => {
    return this.myObservable()
       .flatmap((x) => return this.http
              .get(''http://jsonplaceholder.typicode.com/posts/1'')
              .map( (responseData) => {
                    return responseData.json();
              })
              ...

Revisa todos los detalles aquí

APROVECHANDO LOS OBSERVABLES EN ANGULAR 2

Answer 2

Mientras que flatMap () puede funcionar, ya que no está pasando un parámetro que se usa [vea param (x)], el mejor operador para usar en este escenario es forkJoin ().

Vea este ejemplo: https://.com/a/38049268/1742393

   Observable.forkJoin(
    this.http.get(''/app/books.json'').map((res:Response) => res.json()),
    this.http.get(''/app/movies.json'').map((res:Response) => res.json())
).subscribe(
  data => {
    this.books = data[0]
    this.movies = data[1]
  },
  err => console.error(err)
);