在两个 API Angular 9 之间创建数组数据每个 ID

Question

我正在学习并坚持这个逻辑。 我们是否可以从两个 API 之间的每个 ID 获取数组数据

让我们先调用 API 获取列表 ID

[1,2,3,4,5]

然后第二个 API 获取包含详细数据的列表。 如果第二个 API 如果 url 没有 id（例如：htp://pokeapi.com/data/2），则结果是 null

{"by":"abc","id":2,"score":2000,"desc":"passed"}

我想通过 id first API 从第二个 API 获取数据并获取包含所有数据的结果数组

我试过了，但不是很好，哈哈。

.subscribe(
    (items) => {
      for (var i = 0; i < items.length; i++) {
        var result = items[i];

        this.secondAPI
          .get({ id: result })
          .subscribe(
            (item) => {
              this.items = item;
              console.log('itemm ' + JSON.stringify(this.items));
            }
          );
      }
    },
    error => console.log('Error data ' + error)
  );

我尝试了其他方法将数据传递到 Input 但不显示结果（空）

在 player.ts

@Input() dataId: any;
items: any;

getPlayer() {
  this.firstAPI
    .get()
    .subscribe(
      items => {
        this.items = items;

        console.log('data ' + JSON.stringify(this.items));
      }
    );
}

并在 Html 文件中

<li *ngFor="let item of items; let i = index">
  <ion-label routerLink="/detail/{{ item }}">
    <item class="player" [dataId]="item"></item>
  </ion-label>
</li>

谢谢你的帮助！

注意：我已经完成了这个。 刚刚从其他组件传递数据。

Answer 1

将 rxjs 运算符与 pipe 一起使用：

    .pipe(
         concatMap(x => x),
         switchMap(x => this.secondAPI.get({ id: x })),
         toArray()
    )
    .subscribe(item => console.log(item))