Angular 从服务类进行嵌套HTTP调用并返回可观察的

我需要在Angular 5中从我的服务类发出两个依赖的HTTP调用，并返回一个Observable，以便我的组件可以订阅它。因此，在服务类函数中：

• HTTP调用1将返回一些数据，例如，类型为

  string

• 此

  字符串

  将被HTTP调用2用作输入
• HTTP调用2返回一个

  string[]

• 服务类函数的返回类型将是

  可观察的类型

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

getData（）：可观察{
this.httpClient.get（'service1/getData'）.subscribe(
dataFromSvc1=>{
返回此.httpClient.get（'service2/getData/'+dataFromSvc1）；
},
错误=>{
回程抛掷器（err）；
}
)
}

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

getData（）：可观察{
返回此.httpClient.get（'service1/getData'）
.烟斗(
开关映射（dataFromSvc1=>{
返回此.httpClient.get（'service2/getData/'+dataFromSvc1）；
}),
catchError（this.someErrorHandler）
);
}

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

---

让我知道这是否有效。

mergeMap或switchMap可以在嵌套调用的情况下使用，以获得单个可观察的as响应

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
    }
  )
}

getData（）：可观察{
返回此.httpClient.get（'service1/getData'）.pipe(
合并映射（（dataFromSvc1）=>{
返回此.httpClient.get（'service2/getData/'+dataFromSvc1）；
}),
catchError（（err）=>{
//处理错误场景
}
)
}

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

---

您的意思是异步吗？不，是同步的。调用1的结果用于调用2中只是为了澄清…http是异步的。您提交一个请求…一段时间后它返回一个响应。您要问的是执行嵌套调用，对吗？要执行嵌套http调用，请使用如下所示的开关映射：是，它工作了。谢谢。已编辑您的代码段以修复语法。示例：

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

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
    }
  )
}