Question

我有一个非常简单的控制器，它在一个承诺链中一个接一个地连续运行三个超时。我使用了一个函数timeoutHelper来创建超时并将它们记录到控制台。

.controller('ctrl', function($timeout) { 
    function timeoutHelper(time) {
      var t = $timeout(time);
      console.log(t);
      return t;
    }

    timeoutHelper(500)
    .then(function(){
      return timeoutHelper(500);
    })
    .then(function(){
      return timeoutHelper(500);
    });
  })

工作正常，每个$timeout在500ms后记录到控制台，但$$timeoutId不连续。控制台的输出如下所示

Promise {$$state: Object, $$timeoutId: 1}
Promise {$$state: Object, $$timeoutId: 3}
Promise {$$state: Object, $$timeoutId: 5}

在承诺链之外创建$timeout会导致按预期连续$$timeoutId。为什么会这样？

这是一个问题的原因是因为我在单元测试中刷新$timeout时出现问题。调用$timeout.flush(500)三次后，调用$timeout.verifyNoPendingTasks时会抛出异常。这个例子只是我在我的应用程序中所做的简化版本，但它演示了同样的问题。

以下是代码的Plunkr

Answer 1

而不是调用.then方法中的函数。将timeou函数作为参数传递给.then方法

angular.module('timeoutApp', [])

      .controller('ctrl', function($timeout, $q, $scope) {

        function timeoutHelper(time) {
          var t = $timeout(time);
          console.log(t);
          return t;
        }

        timeoutHelper(500)
        .then(timeoutHelper(500))
        .then(timeoutHelper(500));


      })

结果

Promise {$$state: Object, $$timeoutId: 1}

Promise {$$state: Object, $$timeoutId: 2}

Promise {$$state: Object, $$timeoutId: 3}

Demo

在promise链中使用$ timeout的非连续$ timeoutId（AngularJS 1.x）

1 个答案: