angularjs - 启动新 Controller 时停止 $timeout

Question

我每 2 秒轮询一次我的数据，以使它们在页面上保持更新。我的问题是当我访问另一个页面时超时保持事件状态。访问新页面时如何取消超时？

function IndexCtrl($scope, $timeout, RestData) {
    $scope.rd = {};

    (function getRestDataFromServer() {
        RestData.query(function(data){
            $scope.rd = data;
            $timeout(getRestDataFromServer, 2000);
        });
    })();
}

//编辑
我找到了一个解决方案，但我不确定它是否是一个好的解决方案。当我将超时保存到 $rootScope 时，我可以在所有其他 Controller 中取消它。

function IndexCtrl($scope, $rootScope, $timeout, RestData) {
    $scope.rd = {};

    (function getRestDataFromServer() {
        RestData.query(function(data){
            $scope.rd = data;
            $rootScope.prom = $timeout(getRestDataFromServer, 2000);
        });
    })();
}

function newPageCtrl($scope, $rootScope, $timeout) {
    $timeout.cancel($rootScope.prom); 
}

Answer 1

当路由改变时，会广播几个 Angular 事件。您可以在 IndexCtrl 内收听它们。使用 $scope.$on并采取相应的行动:

$销毁事件

var promise = $timeout(getRestDataFromServer, 2000);
...

$scope.$on('$destroy', function(){
    $timeout.cancel(promise);
});

$locationChangeStart

var promise = $timeout(getRestDataFromServer, 2000);
...

$scope.$on('$locationChangeStart', function(){
    $timeout.cancel(promise);
});

$timeout()返回一个 promise 对象。这个对象可以提供给 $timeout.cancel()函数取消超时。