前端之家收集整理的这篇文章主要介绍了
AngularJS停止定时器$interval，
前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。
1、问题背景
设置一个定时器，给定两个变量startData和endData，计时开始后分别减去5和50；单击停止暂停定时器，重置后数据恢复到原来的数据。
2、实现源码
- <!DOCTYPEhtml>
- <html>
- <head>
- <Metacharset="UTF-8">
- <title>AngularJS停止定时器</title>
- <scriptsrc="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
- <script>
- varapp=angular.module("intervalApp",[]);
- app.controller("intervalController",["$scope","$interval",function($scope,$interval){
- $scope.startData=100;
- $scope.endData=1000;
-
- varstopEvent;
- $scope.startEvent=function(){
- if(angular.isDefined(stopEvent))return;
-
- stopEvent=$interval(function(){
- if($scope.startData>50&&$scope.endData>500)
- {
- $scope.startData=$scope.startData-5;
- $scope.endData=$scope.endData-50;
- }
- else
- {
- $scope.stopClick();
- },1000)
- };
- $scope.stopClick=function(){
- if(angular.isDefined(stopEvent))
- $interval.cancel(stopEvent);
- stopEvent=undefined;
- }
- $scope.resetEvent=function(){
- };
- $scope.$on("$destory",function(){
- $scope.stopClick();
- });
- }]);
- </script>
- </head>
- <bodyng-app="intervalApp">
- <divng-controller="intervalController">
- <buttondata-ng-click="startEvent()">开始</button>
- <buttondata-ng-click="stopClick()">停止</button>
- <buttondata-ng-click="resetEvent()">重置</button><br>
- <div>开始数据：{{startData}}</div><br>
- <div>结束数据：{{endData}}</div><br>
- </div>
- </body>
- </html>
3、实现结果
（1）初始化
（2）点击开始
（3）点击停止
（4）点击重置
转自：http://www.jb51.cc/article/p-pcdrepng-wk.html
原文链接：https://www.f2er.com/angularjs/147019.html
