在承诺链(AngularJS 1.x)中使用$timeout的非连续$timeoutId

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在 500 毫秒后记录到控制台，但$$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}

演示