Question

我有一个observable，在订阅时也嵌套了observable。

它源于一个问题，即在for循环中多次调用api以获得最终输出。

更具体地说，我首先调用api来获取一个小部件，然后我调用api来返回一个foo数组，我将其添加到widget对象中。最后，我循环遍历foo数组并检索foo.id，用于获取bar。然后将条添加到foo [x]元素。

当我在路由器中解析窗口小部件时，窗口小部件的属性就在那里，但是foo数组作为可观察对象返回。我想在路由解析之前订阅foo，然后遍历foo并订阅每个foo元素中的bar。

let routes: Routes = [{
  path: 'landing-page',
  component: LandingPageComponent,
  resolve: {
    widget: WidgetResolve,
    foo: FooResolve(widget),
    bar: BarResolve(foo)
  }
}];

Answer 1

我没有返回嵌套的observable，而是使用flatMap和forkJoin来允许多个api调用在一个订阅中解析。答案基于Combining multiple Http streams with Observables in Angular 2

的帖子

getWidget(id) {
  return Observable.forkJoin(
    this.service.getWidget(id),
    this.getFoo(id)
    ).map(res => {
      res[0].foo = res[1];
      return res[0];
    });
}


getFoo(id): Observable<any[]> {
  return this.service.getFoo().flatMap(fooArr => {
    return Observable.forkJoin(
      fooArr.map((foo: any) => {
        return this.service.getBar(foo.id, id)
        .map((barArr: any[]) => {
          foo.bar = barArr;
          return foo;
        });
      })
      );
  });
}

Angular 2 Route解析多个嵌套Observable

1 个答案: