在Angular JS中等待所有的$http请求完成

Question

我有一个页面，可以根据变量的长度发出不同数量的$http请求，然后我希望只有当所有请求完成后才将数据发送到作用域。对于这个项目，我不想使用jQuery，请勿在回答中包含jQuery。目前，每次请求完成时都会将数据发送到作用域，这不是我想要发生的。

以下是我目前拥有的部分代码。

for (var a = 0; a < subs.length; a++) {
  $http.get(url).success(function (data) {
    for (var i = 0; i < data.children.length; i++) {
      rData[data.children.name] = data.children.age;
    }
  });
}

这里是我持怀疑态度的部分，因为$q.all()需要一个参数，但在Angular文档中没有提到，我不确定应该是什么。

$q.all().then(function () {
  $scope.rData = rData;
});

非常感谢您的任何帮助。

- ntzm

Answer 1

$http调用总是返回一个Promise，可以与$q.all函数一起使用。

var one = $http.get(...);
var two = $http.get(...);

$q.all([one, two]).then(...);

关于这个行为的更多细节，请查看文档：

all(promises)

promises - 一个包含一组 promise 的数组或哈希表。

在您的情况下，您需要创建一个数组并在循环中将所有调用推入其中。这样，您可以像上面的示例一样在您的数组上使用 $q.all(…) ：

var arr = [];

for (var a = 0; a < subs.length; ++a) {
    arr.push($http.get(url));
}

$q.all(arr).then(function (ret) {
    // ret[0] contains the response of the first call
    // ret[1] contains the second response
    // etc.
});

- Michał Miszczyszyn