按下后退按钮后停止角度$timeout计时器

Stop angular $timeout timer after hitting back button

本文关键字：timeout 计时器 按钮      更新时间：2023-09-26

在我的Angular应用程序中，我有第1页和第2页。

第1页基本上是带有链接到第2页的按钮的主页。

第1页有一个名为Page1App的角度应用程序和一个称为Page1Ctrl控制器。第2页有一个名为Page2App的角度应用程序和一个称为Page2Ctrl控制器。

Page1App将Page2App

angular.module('Page1App', ['Page2App']);

在第2页中，有一个计时器，它的工作原理与这个JSFiddle中的计时器类似（下面重复代码）

 $scope.nextPic = function() {
      $timeout.cancel(picTimeout)
      if (++$scope.picIndex >= $scope.pics.length) $scope.picIndex=0
      picTimeout = $timeout($scope.nextPic, 2000)
  }
  $scope.prevPic = function() {
      $timeout.cancel(picTimeout)
      if (--$scope.picIndex < 0 ) $scope.picIndex=$scope.pics.length-1
      picTimeout = $timeout($scope.nextPic, 2000)
  }
  picTimeout = $timeout($scope.nextPic, 2000)

问题是，当我从Page2返回Page1时，计时器会在后台继续运行，偶尔会弹出一个alert-如果您在Page2上，这是可以的，但如果您已经离开Page2，则不可以。

当用户离开第2页时，我如何使它停止？

您可以侦听范围破坏事件侦听器并清除超时。

例如：

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

检查作用域的$destroy事件的DOC。

相关文章：