从服务类进行嵌套 HTTP 调用并返回 Observable

Question

我需要从 Angular 5 中的服务类进行两次依赖 HTTP 调用并返回一个 Observable，以便我的组件可以订阅它。所以在Service Class函数里面：

• HTTP 调用 1 将返回一些数据，例如 string 类型
• 这个string 将被 HTTP 调用 2 用作输入
• HTTP 调用 2 返回，假设是 string[]
• 服务类函数的返回类型将是 Observable<string[]> 类型

不工作的代码（错误：函数必须返回一个值）：

getData(): Observable<string[]> {
  this.httpClient.get<string>('service1/getData').subscribe(
    dataFromSvc1 => {
      return this.httpClient.get<string[]>('service2/getData/' + dataFromSvc1);
    },
    err => {
      return throwError(err);
    }
  )
}

Answer 1

mergeMap 或 switchMap 可用于嵌套调用以获取单个 Observable 作为响应。

getData(): Observable<string[]> {
  return this.httpClient.get<string>('service1/getData').pipe(
    mergeMap( (dataFromSvc1) => {
      return this.httpClient.get<string[]>('service2/getData/' + dataFromSvc1);
    }),
    catchError( (err) => {
      // handle error scenario
    }
  )
}

找到下面的文章来检查服务和组件的示例代码 sn-ps，并逐步解释执行时会发生什么。

https://www.codeforeach.com/angular/angular-example-to-handle-nested-http-calls-in-service

Answer 2

试试 switchMap，类似这样的东西（未经测试或语法检查！）：

getData(): Observable<string[]> {
  return this.httpClient.get<string>('service1/getData')
    .pipe(
      switchMap(dataFromSvc1 => {
         return this.httpClient.get<string[]>('service2/getData/' + dataFromSvc1);
      }),
      catchError(this.someErrorHandler)
    );
}

订阅然后进入调用此方法的组件。

让我知道这是否有效。