Question

我有一个带有下拉菜单的组件。根据下拉菜单中选择的内容，该组件通过发出另一个HTTP请求来显示其他信息。

如果未选择任何内容（首次显示组件），则应从列表中选择第一个组件

我尝试订阅API响应，但是随后我需要进行嵌套的API调用，我知道这是一种不好的做法...

ngOnInit() {
 this.myService.getSelectedUnit(this.id).subscribe(selectedUnit => {
   this.myService.getAllUnits().subscribe(units => {

    if (!selectedUnit) {
      selectedUnit = units[0];
    }

      this.myService.getUnitData(selectedUnit).subscribe(data => {
        this.data = data;
      });

   });

});

}

我想避免嵌套api调用并将其集成到一个可观察的序列中。

Answer 1

switchMap是答案！

ngOnInit() {
 this.myService.getSelectedUnit(this.id).pipe(
   switchMap(selectedUnit => this.myService.getAllUnits().pipe(
     switchMap(units => {
       if (!selectedUnit) {
        selectedUnit = units[0];
       }

       return this.myService.getUnitData(selectedUnit);
     })
   ))
 ).subscribe(data => this.data = data);
}

如何合并来自两个API端点的数据？

1 个答案: