javascript - Angular 中连续异步函数的问题

Question

getEnrolledPlayers 应该从数据库中获取“玩家”对象数组，然后将其传递给 matchMaking 函数。但是，它没有正确通过。

我尝试添加可观察量，尝试订阅

initializeEvent(eventId: string) {
  const enrolledPlayers: PlayerStat[] = [];
  this.getEnrolledPlayers(eventId)
    .subscribe((playerIds: string[]) => {
      for (const playerId of playerIds) {
        this.dataService.fetchSinglePlayer(playerId)
          .subscribe((playerStat: PlayerStat) => enrolledPlayers.push(playerStat));
      }
      this.matchMaking(enrolledPlayers);
    });
}

当我调用这一系列异步函数时，enrolledPlayers[] 被正确计算(7 个元素的数组)，但它没有被正确调用到 matchMaking() 函数。我认为这是因为异步运行时。

Answer 1

是的。这绝对是由于内部订阅解析值的时间差而导致的问题。

我建议使用 forkJoin并在调用 matchMaking 之前等待所有值得到解析。

尝试一下:

initializeEvent(eventId: string) {
  const enrolledPlayers: PlayerStat[] = [];
  this.getEnrolledPlayers(eventId)
    .subscribe((playerIds: string[]) => {
      const playerInfos$ = playerIds.map(playerId => this.dataService.fetchSinglePlayer(playerId));
      forkJoin(...playerInfos$)
        .subscribe(enrolledPlayers: PlayerStat[] => this.matchMaking(enrolledPlayers));
    });
}

或者通过一个订阅

initializeEvent(eventId: string) {
  const enrolledPlayers: PlayerStat[] = [];
  this.getEnrolledPlayers(eventId)
    .take(1)
    .switchMap((playerIds: string[]) => {
      const playerInfos$ = playerIds.map(playerId => this.dataService.fetchSinglePlayer(playerId).take(1));
      return forkJoin(...playerInfos$);
    })
   .tap(this.matchMaking)
    .subscribe();
}