如何在事件广播的超时延迟内停止间隔？答案

【问题标题】：How to stop intervals inside Timeout delay on Event Broadcasts?如何在事件广播的超时延迟内停止间隔？
【发布时间】：2018-10-18 02:45:27
【问题描述】：

在我的 Angular 1.5 中，用户登录他们的帐户后，我有各种指令在超时内开始他们的间隔。例如，我在检查新电子邮件的指令之一中有这个UserEmailNotificationsCtrl：

var intervalPromise;

$timeout(function () {
  stopInterval();
  intervalPromise = $interval(function() {
       checkNewEmail();
  }, 30000);
}, 20000);

$scope.$on('event:stop-intervals', function() {
      stopInterval();
});

$scope.$on('$destroy', function() {
   stopInterval();
});

function stopInterval() {
  $interval.cancel(intervalPromise);
}

如果用户注销，我会广播一个事件，以停止上述间隔以防止 400 错误请求：

function logout() {
 $rootScope.$broadcast('event:stop-intervals');
}

以上工作正常。但是，这是我遇到的问题：

如果用户在间隔检查开始之前注销，因为它包含在 20 秒后开始的超时中，event:stop-intervals 广播将丢失。在这些情况下，间隔在设置的超时之后开始，并且不知道在此之前触发了 event:stop-intervals 以停止间隔。

我的问题是：如何在指令中开始间隔之前检查 event:stop-intervals 广播是否已触发？（或）如果 event:stop-intervals 甚至在超时间隔检查被触发之前被触发，指令如何阻止间隔开始？

【问题讨论】：

可能在你的stopInterval 方法中调用var timeoutPromise = $timeout(function () { ... }, 20000); 然后调用$timeout.cancel(timeoutPromise); 可以为你解决问题。所以它会取消超时，甚至不会设置间隔。
你是正确的。谢谢你。我注意到我的 http-auth-interceptor 在 400 个错误请求期间也广播了$rootScope.$broadcast('event:stop-intervals');，但似乎间隔仍然没有被取消。这是因为在注销期间路由已更改，并且范围不再处于活动状态。所以就像你建议的那样，我添加了 var timeoutPromise 然后在 $scope.$on('$destroy', function() {} 中添加了取消超时。因此，对于我的设置，在 stopInterval 方法中添加相同的内容就可以了。太感谢了。你的答案是我的问题的正确答案。
很高兴它对您有所帮助。将添加为答案:)

标签： angularjs angularjs-directive angular-broadcast

【解决方案1】：

在您的 stopInterval() 方法中使用 $timeout.cancel() 取消 $timeout 承诺将解决您的问题，因此甚至不会设置间隔：

var intervalPromise;

var tiemoutPromise = $timeout(function () {
  stopInterval();
  intervalPromise = $interval(function() {
       checkNewEmail();
  }, 30000);
}, 20000);

$scope.$on('event:stop-intervals', function() {
  stopInterval();
});

$scope.$on('$destroy', function() {
  stopInterval();
});

function stopInterval() {
  $timeout.cancel(tiemoutPromise);
  $interval.cancel(intervalPromise);
}

【讨论】：