Angular中如何在继续执行前完成所有Promise？

嘿，我太懂你的困扰了——靠$timeout来凑时间等请求完成真的是个治标不治本的临时方案，不稳定不说，还完全没用到Promise本身的核心能力。咱们直接来解决问题：

这两个API就是专门为「等待多个异步请求全部完成」设计的，完全不需要猜超时时间，能100%确保所有请求结束后再执行后续代码（包括finally）。

情况1：所有请求必须全部成功才继续执行 #

如果你的业务逻辑要求只要有一个请求失败，就不处理结果，那用Promise.all()：

// 先把所有请求的Promise收集到数组里
const requestPromises = [
  fetch('/api/user-info'),
  fetch('/api/product-list'),
  fetch('/api/order-history')
];

Promise.all(requestPromises)
  .then(allResults => {
    // 到这里说明所有请求都成功了！allResults是按原顺序排列的请求结果数组
    console.log('所有请求完成，结果:', allResults);
    // 这里放心写你的展示逻辑就行
  })
  .catch(error => {
    // 只要有一个请求失败，就会立刻进入这里
    console.error('某个请求失败了:', error);
  })
  .finally(() => {
    // 不管成功还是失败，这里**一定会**在所有请求都结束后执行
    console.log("所有请求都已处理完毕，该做收尾工作了");
  });

情况2：不管请求成功失败，都要等全部完成再继续 #

如果哪怕有请求失败，你也想拿到所有成功的结果、同时记录失败的请求，那用Promise.allSettled()：

const requestPromises = [
  fetch('/api/user-info'),
  fetch('/api/product-list'),
  fetch('/api/order-history')
];

Promise.allSettled(requestPromises)
  .then(allResults => {
    // allResults里每个元素都包含请求状态：成功的是{status: 'fulfilled', value: 结果}，失败的是{status: 'rejected', reason: 错误}
    const successData = allResults
      .filter(item => item.status === 'fulfilled')
      .map(item => item.value);
    const failedRequests = allResults
      .filter(item => item.status === 'rejected')
      .map(item => item.reason);

    console.log('成功拿到的数据:', successData);
    console.log('失败的请求:', failedRequests);
    // 这里可以根据成功的数据做展示，同时处理失败的情况
  })
  .finally(() => {
    // 这里100%会在**所有请求彻底完成**后执行，完全不用担心中途提前触发
    console.log("所有请求都结束了，不管成没成");
  });

如果你用的是AngularJS（因为提到了$timeout） #

AngularJS自己的$q服务也有对应的方法，用法和原生Promise几乎一致：

// AngularJS环境下的写法
const requestPromises = [
  $http.get('/api/user-info'),
  $http.get('/api/product-list'),
  $http.get('/api/order-history')
];

// 用$q.all()对应原生Promise.all()
$q.all(requestPromises)
  .then(allResults => {
    // 处理结果
  })
  .catch(error => {
    // 处理错误
  })
  .finally(() => {
    // 收尾工作
  });

本质是你没正确让代码等待所有Promise的状态变更，而是靠“猜时间”来延迟执行。但网络请求的响应时间完全不可控——有时候快有时候慢，超时时间设短了就会有请求还没完成代码就跑了，设长了又浪费用户时间。而用上面的Promise API，是主动监听所有请求的完成状态，完全不会有这种问题。

内容的提问来源于stack exchange，提问作者Jaqueline Passos