首页 > 解决方案 > 在 RxJs 中链接依赖的 Observable

问题描述

链接一系列 HttpClient 调用的“最佳实践”是什么(假设当前调用取决于先前调用的结果)?以下解决方案是有效的,但显然不推荐。每个 get 返回一个 Observable。在解决方案中首选使用“管道”运算符(RxJs 中的较新方法)。

ngOnInit() {
  this.firstService.get().subscribe((first) => {
    this.secondService.get().subscribe(second => {
      this.thirdService.get().subscribe(third => {
        ... possibly more nested calls ...
      })
    })
  })
}

标签: angularrxjsangular-httpclient

解决方案


您的代码远远超出了最佳实践。永远不要在另一个内部订阅。

如果您的任务是三个不相互依赖的独立任务/可观察对象,则考虑使用forkJoin(所有可观察对象同时开始,当最后一个可观察对象完成时返回结果)

let observable1(param1);
let observable2(param2);
let observable3(param3);

let joinedObservables = forkJoin(observable1, observable2, observable3).subscribe(x => {
  let result1 = x[0];
  let result2 = x[1];
  let result3 = x[2];

  ...
});

如果它们的结果相互依赖,您可以使用switchMap, flatMap, mergeMap, exhaustMap(检查差异)

let resultObservable =  return this.observable1().pipe(mergeMap((param1) => {
  return this.observable2().pipe(map((param1) => {

    ....        

    return <result>;
  }));
}));

resultObservable.subscribe(x => {
   ...
});

推荐阅读