Question

我正在使用Observables，我有一个用例：

我必须得到＆＃34;页面＆＃34;来自我的服务Page[]
对于每个＆＃34;页面＆＃34;我必须得到＆＃34;部分＆＃34;来自其他服务
同时订阅所有＆＃34;部分＆＃34;我必须根据返回的数据做一些动作。

一旦所有这些请求都完成，就必须采取一些行动。

Answer 1

您需要使用 mergeMap 和 forkJoin

使用forkJoin，您可以及时触发并行请求，直到所有请求都完成。

this.http.get('/api/pages/')
    .map((res: any) => res.json())
    .mergeMap((pages: any[]) => {
      if (pages.length > 0) {
        return Observable.forkJoin(
          pages.map((page: any) => {
            return this.http.get('/api/sections/' + page_id)
              .map((res: any) => {
                let section: any = res.json();
                // do your operation and return
                return section;
              });
          });
        );
      }
      return Observable.of([]);
    });
}

Answer 2

通常，在嵌套异步调用时尽量保持平坦。否则，你正在创建回调地狱，这比使用常规迭代代码更复杂：

this.http.get('/api/pages/')
  .map((res: Response) => res.json())
  .concatMap((pages: Page[]) => {
    const observables = pages.map(p => this.http.get('whatever' + p.id));

    return Observable.forkJoin(observables, (...results) => 
      results.map((result, i) => {
        pages[i].sections = result;
        return pages[i];
      })
    )
  })
  .subscribe(pagesWithSections => ...);

forkJoin()运算符将选择器函数作为参数，使您可以处理所有源Observable的结果。我正在使用它来更新原始pages数组并将其返回。

处理多个http请求并等待所有使用Angular RxJs Observable完成

2 个答案: