javascript - 通过可观察对象映射并返回嵌套可观察对象的值

Question

希望你能帮帮我。
我有一个名为 getEnergyFromPower 的函数，它返回一串值:

getEnergyFromPower(systemId: number, objectId?: string) {
    ...

    return this.httpClient.get(this.BASE_URL + this.AGGREGATE_URL, {
      headers: this.BEARER_OPTIONS.headers,
      responseType: 'text',
      params: params
    })
  }

另一个应该遍历 Observable 的值。
但是当我订阅和 console.log 时，它会返回一个 observables 数组，如下所示:

organizeEnergy(systemId: number = 49439) {
    return this.getSystemLayout(systemId).pipe(
      map(res => {
        return res.map(({object_id}) => this.getEnergyFromPower(49439, object_id))
      })
    )
  }


this.optService.organizeEnergy().subscribe(res => console.log(res))

// Returns: 
// [Observable, Observable, Observable, Observable, Observable, Observable, Observable, Observable]

我测试了 object_id 是否正确，它返回正确的值，如下所示:

organizeEnergy(systemId: number = 49439) {
    return this.getSystemLayout(systemId).pipe(
      map(res => {
        return res.map(({object_id}) => object_id)
      })
    )
  }

this.optService.organizeEnergy().subscribe(res => console.log(res))
//RETURNS 
// (8) [83978300, 83978301, 83978302, 83978303, 83978304, 83978305, 83978306, 83978307]

我还像这样测试了它的硬编码，它可以工作:

  organizeEnergy(systemId: number = 49439) {
    return this.getEnergyFromPower(systemId, '83978300')
  }

this.optService.organizeEnergy().subscribe(res => console.log(res))
//RETURNS 
// 2021/07/13 08:55:00.000,38

所以我猜我的问题是当我尝试在这一行中映射响应时:

organizeEnergy(systemId: number = 49439) {
     ...
        return res.map(({object_id}) => this.getEnergyFromPower(49439, object_id))
     ...
  }

所以我想遍历它并在订阅它时动态地得到结果。
也许这是我还没有掌握的东西，因为我开始使用 Angular/Observables/HttpClient 已经两周了

Answer 1

我认为您需要使用 switchMap 的组合和 combineLatest .

import { combineLatest } form 'rxjs';
import { switchMap } from 'rxjs/operators';

organizeEnergy(systemId: number = 49439) {
    return this.getSystemLayout(systemId).pipe(
      // change map to switchMap because we are going to switch to a new observable
      switchMap(res => {
        // combine all HTTP requests and return the results as an array
        return combineLatest(...res.map(({object_id}) => this.getEnergyFromPower(49439, object_id)));
      }),
    )
  }

// This should give you [2021/07/13 08:55:00.000,38, ...]
this.optService.organizeEnergy().subscribe(res => console.log(res))