1

我有两个 api 请求，第二个取决于第一个。第一个请求获得一个包含 3 个设施的数组。在此之后，我需要为每个设施做一个 api 请求以获取我需要的图像。我需要设施的 uuid。我认为使用mergeMap 可以很容易做到这一点。但是我有 2 个问题并且找不到解决方案：在合并映射中，我认为服务将是数组的一项服务，但它是整个数组。此外，我还需要订阅 getImage() 并将值存储在 service.image 中。

getNewestNursingServices() {
  return this.http.get('api/nursing-service/newest').pipe(
   mergeMap(service => this.getImage('PREVIEW', service.uuid))
  );
}
getImage(type: string, nursingService: string): Observable<Image> {
  return this.http.get<Image>('api/nursing-images/' + type + '/' + nursingService);
}
4

2 回答 2

2

您可以使用forkJoin或concat：

getNewestNursingServices() {
  return this.http.get('api/nursing-service/newest').pipe(
   mergeMap((service: any[]) => {
     return concat(...service.map(s => {
       return this.getImage('PREVIEW', s.uuid)
     }) 
   }) 
  );
}
于 2020-02-04T16:37:51.627 回答
0

我希望我的问题是正确的。

所以你的第一个问题是第一个 api 调用返回一个数组。这可以通过mergeMap-ing 扁平化数组来解决，因此下游 observable 将连续发出 3 个服务。

getNewestNursingServices() {
  return this.http.get('api/nursing-service/newest')
    .pipe(
      mergeMap((services: []) => {
        // `of` will return an observable which emits the items of the array after each other
        return of(services);
      }),
      mergeMap(service => this.getImage('PREVIEW', service.uuid)),
      tap((image: Image) => {
        // here you can do sideeffects with the images, eg. pushing them into an array somewhere...
      }),
      reduce(
        (allImages: Image[], currentImage: Image) => {
          // ... or you can collect them into an array, so the downstream will be `Observable<Image[]>`
          allImages.push(currentImage);
          return allImages;
        },
        [],
      ),
    );
}

关于您必须订阅的事实，这是不正确的async，如果您不想执行副作用+订阅模式，您可以在管道中使用生成的 observable，例如。

于 2020-02-04T16:51:35.843 回答