TypeScript - 等待observable / promise完成，并返回observable

Question

我对TypeScript＆amp; RxJS，我试图在另一个Observable完成后返回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');
        });

}

我收到此错误：“返回的表达式类型订阅不能分配给Observable<any>类型”。

我完全理解这里的错误（一个Observable就像一个流，而订阅就是“观察”那个流的事实），但我不知道如何“等待”完成Observable （或承诺）以返回新的Observable。我怎么能这样做？

Answer 1

问题是我们将observable转换为不同的类型......使用.subscribe - 而我们不应该（它不会返回observable）

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

当我们有一个可观察的...我们应该只使用它的结果并使用.map将其转换为其他东西

  

FlatMap operator

     

将Observable发出的项目转换为Observables，然后   将这些排放量减少为单一的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();
              })
              ...

检查此处的所有详细信息

TAKING ADVANTAGE OF OBSERVABLES IN ANGULAR 2

Answer 2

虽然flatMap（）可以工作，但由于你没有传入一个使用过的参数[参见param（x）]，你在这个场景中使用的最佳运算符是forkJoin（）。

请参阅此示例：https://stackoverflow.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)
);

Answer 3

我有几天在寻找这个答案，因为这也是我的问题。今天我有答案，很想分享。

代码是：

ngOnInit() {
var idEntidade: number;

this.route.paramMap.subscribe(params => {
  idEntidade = Number(params.get('id'));
});

this.dataService.getEstados().subscribe(data => {
  this.estados = data;
});

var dados = this.dataService.getCliente(idEntidade);

**this.subscription = dados.subscribe(
  (data: Cliente) => { this.entityForm.patchValue(data);},
  null,
  () => { this.completed(); }
  );**
}

完成的功能将在预订完成后执行。

completed(){
let idEstado: number = this.entityForm.controls['estadoId'].value;

if (idEstado === null) {
  return;
}

this.dataService.getMunicipiosByEstado(this.entityForm.controls['estadoId'].value)
    .subscribe(data => { this.municipios = data; });
}

希望这会有所帮助。