angularjs $interval 被多次调用

Question

在控制器内部，我正在调用 $interval 以在每第二种秒表服务之后进行一次函数调用。

但问题是当我回到这个路由器时，该函数被调用多次，例如如果我去另一个菜单然后回到这里..计时器将被更改两次..如果我再做一次然后三次。

我在路由中尝试了以下 3 种方法，在控制器中都具有相同的结果：

$timeout(updateTimer, 1000);

setInterval(function () { $scope.$apply(updateTimer); }, 1000);

$interval(updateTimer, 1000);

为什么当我回到这个页面时，计时器会被调用多次？？

Answer 1

每次调用路由时，都会实例化与该路由关联的控制器。每次实例化控制器时，您都会开始一个间隔。所以你得到了这个结果。

当控制器不再使用时，请务必取消您的时间间隔。 The official documentation 有一个关于这种情况的具体警告，并举例说明一旦控制器不再使用如何取消间隔：

注意：此服务创建的间隔必须在您完成后明确销毁。特别是当控制器的作用域或指令的元素被销毁时，它们不会自动销毁。您应该考虑到这一点，并确保始终在适当的时候取消间隔。有关如何以及何时执行此操作的更多详细信息，请参见下面的示例。

var stop = $interval(...);

$scope.$on('$destroy', function() {
    // Make sure that the interval is destroyed too
    $interval.cancel(stop);
});