Rxjs：map 數組字段中的每個元素來自 object 的可觀察對象和另一個可觀察對象

Question

我有一個名為 getTransactionDetails(id:string) 的方法，它返回一個 Observable of TransactionDetails object

getTransactionDetails(id:string):Observable<TransactionDetails> 

TransactionDetails object 如下所示：

class TranscationDetails{
    id:string;
    accessCode: string;
    veggiesList: Array<Veggie>;
    meatList: Array<Meat>;
}

Veggie object 看起來像這樣：

class Veggie{
    id: string;
    name: string;
}

我有另一個方法叫做 getVeggieSummary(veggieId: string)，它返回一個 VeggieSummary 的 Observable：

getVeggieSummary(veggiesId:string):Observable<VeggieSummary>

VeggieSummary 看起來像這樣

class VeggieSummary{
    id:string;
    name:string;
    color:string;
    kind:string;
}

我想調用 getTransactionDetails(1)，並將 veggiesList 中的所有 Veggies 元素轉換為 VeggieSummary 並返回一個 VeggieSummary 數組。

這就是我所擁有的

getTransactionDetails(1)
.flatMap(transactionDetails=>
    transactionDetails.veggiesList
       .map(veggie=>getVeggieSummary(veggie.id)))
.subscribe(result=>
    console.log(result)
)

目前， result是一個Observable<VeggieSummary>並且內部 observable 甚至沒有被訂閱......

我怎樣才能擁有一個帶有 rxjs 運算符的Observable<VeggieSummary[]> ？

注意：我的app的angular版本不支持pipe，RxJS版本是v5

Answer 1

您能否嘗試使用forkjoin包裝數組以查看它是否解決了問題？ 我認為目前它正在返回Observable<VeggieSummary>[]

getTransactionDetails(1)
.flatMap(transactionDetails=>
    forkJoin(transactionDetails.veggiesList
       .map(veggie=>getVeggieSummary(veggie.id))))
.subscribe(result=>
    console.log(result)
)

Answer 2

您只需要用forkJoin包裝內部可觀察對象，這會將Observable<VeggieSummary>[]轉換為Observable<VeggieSummary[]>

    getTransactionDetails(1)
      .flatMap((transactionDetails) =>
        forkJoin(
          transactionDetails.veggiesList.map((veggie) =>
            getVeggieSummary(veggie.id)
          )
        )
      )
      .subscribe((result) => console.log(result));

Answer 3

使用forkjoin，這有效：

  getTransactionDetails(1)
  .flatMap((transactionDetails) =>
    forkJoin(
      transactionDetails.veggiesList.map((veggie) =>
        getVeggieSummary(veggie.id)
      )
    )
  )
  .subscribe((result) => console.log(result));

我發現 zip 與傳播運算符 (...) 也有效：

   getTransactionDetails(1)
  .flatMap((transactionDetails) =>
    zip(
      ...transactionDetails.veggiesList.map((veggie) =>
        getVeggieSummary(veggie.id)
      )
    )
  )
  .subscribe((result) => console.log(result));

我從另一篇文章中了解到的。

但我不確定使用哪個，forkjoin 還是 zip？ 有關系嗎？

我還從該帖子中了解了 rest 運算符/展開運算符 (...)。

但是我仍然不太了解它在這個例子中是如何工作的。

我不確定我使用的是哪個，我使用的是 rest 還是傳播運算符？

它等價於什么？