角度$timeout调用仅运行一次

Question

我正在使用AngulaJs和Ionic。

我尝试每 3 秒调用一次函数，仅 10 次（这就是我不使用 $interval 的原因）。问题是，下面的代码只调用该函数一次（而控制台的调试代码被调用 10 次）。

for (i = 0; i < 10; i++)
 {
   $timeout(function () {
     $scope.play(); // this is the called function
     console.log("progress bar: " + i);
   }, 3000);
 }

任何帮助将不胜感激，

提前感谢，

帕古吉姆

Answer 1

For 循环将同时启动 10 次超时。但似乎您希望他们一个接一个地执行。对于这种情况，您可以使用递归。

var count = 0;
replay();
function replay() {
    $timeout(function () {
     if(count < 10) {
         $scope.play();
         count++;
         replay(); // call this function again
         console.log("progress bar: " + $scope.progressVal);
     }
    }, 3000);
}

Answer 2

我尝试每 3 秒调用一次函数，仅调用 10 次

您可以使用可选的 count 参数 $interval 。

var i=0;
function reportProgress() {
    $scope.play(); // this is the called function
    console.log("progress bar: " + i);
    i++;
};
$interval(reportProgress, 3000, 10);

从文档中：

$interval

用法 $interval(fn, delay, [count], [invokeApply], [Pass]);

计数（可选）重复的次数。如果未设置，或 0，将重复 无限期。（默认值：0）

-- AngularJS $interval API 参考

Answer 3

实际上，$scope.play()被调用了 10 次，但几乎同时调用。要每 3 秒调用一次函数，可以使用闭包来保持值i并将超时设置为 3000*i 。我认为这就是你想要的：

for (i = 0; i < 10; i++) {
    (function(i) {
        $timeout(function() {
            $scope.play();
            console.log("progress bar: " + i)
        }, 3000 * i);
    })(i);
}

杰斯菲德尔：https://jsfiddle.net/ealonwang/ens9wu0g/15/。观察值和控制台日志每 3 秒更改一次。