来自 Promise.all 的值并不总是由 Angular 解释

Value from Promise.all not always interpreted by Angular

我有一个这样的控制器:

controller.things = ['a', 'b', 'c'];
controller.loading = true;
controller.responses = [];

controller.handlePromises = function(){
   var promises = [];

   for(promiseIndex = 0; promiseIndex < controller.things.length; promiseIndex++) {
        promises.push(controller.promise(things[promiseIndex]);
    }

    Promise.all(promises).then(function success(response){
        for(responseIndex = 0; responseIndex < response.length; responseIndex++){
           responses.push(response[responseIndex].data);
        }
        controller.loading = false;
    }
}

controller.promise = function(value){
   //Some $http request to Database;
}

controller.handlePromises();

controller.things 中的内容量取决于用户。附加到此的是一个简单的 html 页面,它执行以下操作:

<div ng-if="!controller.loading">
    <div ng-repeat="response in controller.responses">
       {{response}}
    </div>
</div>

我的问题是内容有 50/50 的机会可见,其他时候我可以在调试器中看到承诺已解决并且加载设置为 false,但 ng-if 保持隐藏内容。即使显示了内容,ng-repeat 也很有可能说 controller.responses 仍然是空的。

我如何保证 ng-if 接受 controller.loading 为 false 当 promise 已经解决时,无论需要多长时间?此外,对于 ng-repeat 的相同问题有时没有看到 controller.responses 中的值。 我考虑过超时,但这不是理想的解决方案,因为它可能需要半秒之间的任何时间到十秒。

问题是您使用的是 Promise.all 而不是 $q$q 是由 Angular 团队构建的 Promise 库,它将为您执行 $digest 循环。

$q.all(promises).then(function success(response) {
  for (responseIndex = 0; responseIndex < response.length; responseIndex++) {
    responses.push(response[responseIndex].data);
  }
  controller.loading = false;
});

Read more about $q