angular rxjs：處理多個 http 請求

Question

我有以下偽代碼

objects = [obj1, obj2, obj3]    
for obj in objects {
user: http.get(obj1.user_id)
product: http.get(obj1.product_id)
}.subscribe(results => {

do something with results

})

我在這里想要的是，我遍歷一個對象數組，並為每個 object 獲取相關的用戶和產品，然后訂閱以對用戶和產品做一些事情。 我怎樣才能做到這一點？

Answer 1

您可以使用 RxJS forkJoin和Array#map來並行觸發多個可觀察對象。

const objects = [obj1, obj2, obj3];

forkJoin(
  objects.map(obj =>           // <-- `Array#map` function
    forkJoin({
      user: http.get(obj.user_id)
      product: http.get(obj.product_id)
    })
  )
).subscribe({
  next: (res) => {
    console.log(res);
    // use `res`
  },
  error: (err) => {}
});


/*
output in subscription: 
[
  { 
    user: result from `http.get(obj1.user_id)`,
    product: result from `http.get(obj1.product_id)`,
  },
  { 
    user: result from `http.get(obj2.user_id)`,
    product: result from `http.get(obj2.product_id)`,
  },
  { 
    user: result from `http.get(obj3.user_id)`,
    product: result from `http.get(obj3.product_id)`,
  }
]
*/

Answer 2

您可以使用zip()運算符組合您的請求並在每個請求完成后執行一些代碼：

const sourceOne = http.get(obj1.product_id);
const sourceTwo = http.get(obj2.product_id);

zip(sourceOne, sourceTwo).subscribe(val => {
    // do something
});