angular - 使用 RXJS Observables 发送顺序 Http 请求

Question

我想要一个函数，它向端点发送一个 http 请求，给出所有项目的列表，然后发送第二个请求以获取该列表中的第一个元素。该函数应返回最后一项。我正在使用以下代码，但第二个 http 请求不起作用。

getFirstItem(): Observable<any> {
  return this.getList().pipe(concatMap(value => this.getItem(value[0].id)));
}

使用 Angular 7 和 rxjs 6.4.0

任何帮助表示赞赏。

编辑：运行以下代码段时，第二个控制台日志永远不会被调用

getFirstItem(): Observable<any> {
  return this.getList().pipe(
    tap(x => console.log(x)),
    concatMap(value => this.getItem(value[0].id)),
    tap(x => console.log(x)) // never called
}

Answer 1

你的代码看起来不错。我只是想知道如何this.getItem实施。

无论如何，这是一个使用 concatMap 的工作示例： https ://stackblitz.com/edit/rxjs-api-call-jvqj5q?file=src/app/app.component.ts

您可以使用mergeMap, concatMap, switchMap. 所有这些都将起作用。this.getItem它们只是在外部 observable 发出 ( ) 时如何处理内部 Observable ( ) 的行为不同this.getList。

更多信息在这里：https ://morioh.com/p/fcfea9850b90

Answer 2

你可以使用mergeMap

var result = this.getList().pipe(
  mergeMap(value =>  this.getItem(value[0].id)))
);