javascript - 将 3 个流与 Observables 串联和并行组合

Question

我正在尝试将 3 个 HTTP 请求合并为 1 个响应。

最后 2 个请求取决于第一个请求的数据。在阅读 this post 后，我选择了以下使用 flatMap 和 forkJoin 的方法.

作者使用的是旧版本的 Angular 和 RXjs，因此我对其进行了修改以使用管道运算符。但是我仍然无法得到我需要的响应。

  public getAllData(params): Observable<any> {
    return this.http.get<any>(`${this.base}/seasons.json`, {params: params})
    .pipe(
      map((data: SeasonBase) => data.MRData.SeasonTable.Seasons),
      flatMap((seasons: Season[]) => {
        if(seasons.length > 0) {
          return forkJoin(
            of(seasons),
            seasons.map((season: Season) => {
              return this.http.get(`${this.base}/${season.season}/results/1.json`)
                .pipe(
                  map((data: RaceBase) => data.MRData.RaceTable)
                )
            }),
            seasons.map((season: Season) => {
              return this.http.get(`${this.base}/${season.season}/driverStandings.json`)
                .pipe(
                  map((d: any) => d.MRData.StandingsTable.StandingsLists[0])
                )
            })
          ).pipe(
            map((data: any) => {
              let season = data[0];
              let races = data[1];
              let standings = data[2];
              season.testRaces = races;
              season.standings = standings;
              return season;
            })
          )
        }
      }),
      catchError(this.handleError)
    )
  }

上述方法在订阅时返回以下响应:

我想要得到的响应应该更像这样:

{
  season: "1950", 
  url: "http://en.wikipedia.org/wiki/1950_Formula_One_season",
  testRaces: [test_races_data], // dont want observable
  standings: [standings_data] // dont want observable
},
{...},
{...}
etc

testRaces 和 standings 作为 Observables 而不是响应返回。

是否可以在返回响应之前“展开”2 个 Obseravbles，以便我可以映射数据？

Here is a stackblitz当前编写的代码。您可以检查开发工具控制台以查看响应。

Answer 1

在您的类 ErgastService 中，第 24 行和第 30 行返回一个可观察对象数组而不是它们的内容。

快速解决方案是像我在这个 fork 版本中所做的那样添加两个 forkJoin https://stackblitz.com/edit/angular-l3wkmw?file=src/app/api.service.ts