如何防止get操作中的嵌套订阅？

Question

我从对象和图像中获取数据，代码如下：

  this.getObjects(id)
  .subscribe(param => param.results.map(r=> this.getImmagesByObjectId(r.id)
    .subscribe(data=>console.log(data, param))))

正如你所见，我首先获取对象和内部 observable 根据对象 id，我获取对象图像。

我尝试防止嵌套订阅，为此我尝试使用合并所有运算符：

  this.getObjects(id).pipe(mergeMap
  (param => param.results.map(r=> this.getImmagesByObjectId(r.id))
    .subscribe(data=>console.log(data, param))))
  

但是上面的代码不起作用。

我的问题是如何从服务器获取对象和图像并防止嵌套订阅？

更新：

这里是 GetObjects 的实现，你可以看到它返回 observable：

  getObjects(Id: string): Observable<Response<MyObjects[]>> {
    return this.clientObjects.get<Response<MyObjects[]>>(environment.baseUrl + '/main/myobjects/byobjid', {
      params: {
        id: Id
      }
    });
  }

Answer 1

这可以通过使用flatMap（别名mergeMap）和from操作符来实现

this.getObjects(id)
  .flatMap(param => from(param.results)) // `from` to convert array to observable
  .flatMap(result => this.getImmagesByObjectId(result.id)
  .subscribe(data => console.log(data)))) // data contains image

或者，如果我们想在 console.log 中看到 param 在 subscribe 方法中

this.getObjects(id)
  .flatMap(param => { 
    return from(param.results)
      .pipe(
        flatMap(result => this.getImmagesByObjectId(result.id))
        map(image => ({image, param})) // return both image and param as object
      )
  ))   
  .subscribe(data => console.log(data.image, data.param))))