ForEach 等待 Observable 订阅

如何解决ForEach 等待 Observable 订阅

我有这个数组orderCodes，其中包含特定订单的代码，然后通过代码我可以获得该订单的详细信息（每个订单有多个产品），我需要提取每个订单的代码订单详情内的产品。

getorderDetails() 是带有 Observable（产品数组）的 results，每个 result 都有一个 code，这正是我所需要的。

    this.orderCodes.forEach((orderCode) => {

      loadOrderDetails(orderCode);

      getorderDetails().subscribe((order: any) => {
        if (order.results) {
          order.results.map((result) => {
            console.log(result.code);
          });
        }
      });

    });

我已经尝试过这个 forEach 但由于我订阅了 Observable forEach 跳到下一次迭代，我需要等待

有什么想法吗？

解决方法

rxjs 的方式是

from(this.orderCodes).pipe(
  concatMap((orderCode) =>  // concatMap operator makes your items come "in order" one after another
    defer(() => {
      loadOrderDetails(orderCode);

      return getOrderDetails();

    }))
).subscribe((order: any) => {
  if (order.results) {
    order.results.map((result) => {
      console.log(result.code);
    });
  }
});

或者你可以转换为 promises 并使用 async await（更优雅，但通常在 angular 中不太受欢迎，因为如果做错了转换为 promises 和更改检测问题，但这取决于...）

async myFunctionThatDoesAllThis(...) {
....
for(let orderCode of this.orderCodes) {
  loadOrderDetails();
  const order = await getOrderDetails().pipe(take(1)).toPromise(); // pipe(take(1)) could be skipped if getOrderDetails is just an http request.
  if(order.results) {
     order.results.forEach((result) => {
        console.log(result.code);
     });
  }
}