AngularJS - 在 $routeChangeStart 中运行 setInterval()答案

【问题标题】：AngularJS - Run setInterval() inside $routeChangeStartAngularJS - 在 $routeChangeStart 中运行 setInterval()
【发布时间】：2016-12-24 22:52:00
【问题描述】：

我正在使用 setInterval() 检查（每隔几秒）用户的令牌是否已过期。但是，因为我已经包含在 $routeChangeStart 中，所以每次路由更改时都会运行间隔。例如：如果我加载页面然后单击不同的路线，则间隔再次运行，总共运行两个间隔。我在开始时设置了 clearInterval() 因为我认为它会停止任何当前的间隔运行。但是，这不会阻止间隔在每次路由更改时运行。除了在 $routeChangeStart 之外运行间隔，有没有办法在路由更改时停止间隔，然后重新启动它？

$rootScope.$on('$routeChangeStart', function() {
    clearInterval(interval);

    var interval = setInterval(function() {
        var token = $window.localStorage.getItem('token');
        self.parseJwt = function(token) {
            var base64Url = token.split('.')[1];
            var base64 = base64Url.replace('-', '+').replace('_', '/');
            return JSON.parse($window.atob(base64));
        }
        var expireTime = self.parseJwt(token);
        var timeStamp = Math.floor(Date.now() / 1000);
        var timeCheck = expireTime.exp - timeStamp;

        if (timeCheck <= 0) {
            console.log('time expired');
            clearInterval(interval);
        } else {
            console.log('time not expired');
        }
    }, 2000);
});

【问题讨论】：

标签： javascript angularjs settimeout

【解决方案1】：

用$scope.on('$destroy', function () { $interval.cancel(intervalReturnValue);}); 销毁区间在您开始间隔的控制器中

【讨论】：

【解决方案2】：

您应该改用角度 $interval。 $interval 是 setInterval 的包装器，它返回一个承诺对象。承诺可以取消。

类似下面的东西应该可以工作：

var interval = $interval(function() {
    ...
}, 2000);

那么，如果你需要取消间隔，

$interval.cancel(interval);

请注意，$interval 需要注入到您的服务或控制器中。

【讨论】：

谢谢，但每次路线更改时都会产生相同的运行问题

【解决方案3】：

在同一作用域级别捕获事件$routeChangeSuccess，但将interval,count 的2 个变量定义在$routeChangeStart 之外，它会是这样的，如果你需要从内部清除它，它会像这样#2

var interval;
var count = 0;
$rootScope.$on('$routeChangeStart',function(){

  interval = setInterval(function() {
    count++;
   // make what you need here 
   // #2
   if(condition == true){
     clearInterval(interval);
   }
  },2000);
});
 //here if you need after route change  
$rootScope.$on('$routeChangeSuccess',function(){
   if(count == 1 ){
    count = 0;
    clearInterval(interval)
   }
});

【讨论】：