angularjs - $q.all 仅适用于第一次调用

Question

不知道为什么 q.all 第二次不起作用，例如第二次它不会等待所有的 promise 都得到解决。

请查看示例并按“调用服务”按钮。第一次它会等到两个 promise 都得到解决，但如果你再次按下按钮，它会立即响应，不知道为什么？

http://plnkr.co/edit/JNJmX1fjsmxrxYuiNHJb?p=preview

 var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope, $q, MyService1, MyService2) {
  $scope.name = 'World';

  $scope.Status1 = 'Waiting';
  $scope.Status2 = 'Waiting';
  $scope.buttonValue = "Call Services";

  $scope.doServices = function() {

    $scope.Status1 = 'Waiting';
    $scope.Status2 = 'Waiting';
    $scope.buttonValue = "Working ...";
    console.log($scope.Status1)

    var promise1 = MyService1.doIt();
    var promise2 = MyService2.doIt();

   $q.all([promise1, promise2]).then(
      function() {
        $scope.Status1 = 'Done';
      },
      function() {
        $scope.Status1 = 'Failed';
      }
    ).finally(function() {
      $scope.Status2 = 'Done waiting';
      $scope.buttonValue = "Call Services";
      //promises = null;
    });

  }

  $scope.callServices = function() {
     $scope.Status1 = 'Waiting';
  $scope.Status2 = 'Waiting';
    $scope.doServices();
  }

  $scope.reset = function() {
    $scope.Status1 = 'Waiting';
    $scope.Status2 = 'Waiting';
  }

});

app.service("MyService1", function($q, $timeout) {

  var deferred = $q.defer();

  this.doIt = function() {
    $timeout(function() {
      console.log("Service 1 called!");
      deferred.resolve("Service 1 done!");
    }, 2000);

    return deferred.promise;
  }
});


app.service("MyService2", function($q, $timeout) {

  var deferred = $q.defer();

  this.doIt = function() {
    $timeout(function() {
      console.log("Service 2 called!");
      deferred.resolve("Service 2 done!");
    }, 5000)

    return deferred.promise;
  }
});

Answer 1

promise 只能解决一次。您的服务始终返回同样的 promise 。既然解决了就解决了。

顺便说一句，您正在使用反模式。 $timeout 已经返回一个 promise 。您的服务中应该拥有的只是

app.service("MyService1", function($timeout) {

  this.doIt = function() {
    return $timeout(function() {
      console.log("Service 1 called!");
      return "Service 1 done!";
    }, 2000);
  }
});

顺便说一句，服务 2 也是如此。但是，由于这两个服务完全相同(除了超时的持续时间)，并且不执行 $timeout 尚未执行的任何操作，因此您可以直接从 Controller 使用 $timeout 。