AngularJS之定时器无法停止
发布时间:2020-12-17 09:59:50 所属栏目:安全 来源:网络整理
导读:1、问题背景 AngularJS设置定时器后,再次点击按钮触发定时器,这时会出现:前一个定时器未停止,后一个定时器又启动了,导致出现多个定时器同时在运行。 2、问题源码 !DOCTYPE htmlhtmlheadmeta charset="UTF-8"titleAngularJS之定时器无法停止/titlescript
1、问题背景 AngularJS设置定时器后,再次点击按钮触发定时器,这时会出现:前一个定时器未停止,后一个定时器又启动了,导致出现多个定时器同时在运行。 2、问题源码
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>AngularJS之定时器无法停止</title> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> <script> var app = angular.module("btnApp",[]); app.controller("btnCon",function($scope,$interval){ $scope.count = 0; $scope.getDayTime = function(){ var date = new Date(); var year = date.getFullYear(); var month = date.getMonth()+1; var day = date.getDate(); var hour = date.getHours(); var minute = date.getMinutes(); var second = date.getSeconds(); var thisTime = year+"-"+(month<10?"0"+month:month)+"-"+(day<10?"0"+day:day)+" "+(hour<10?"0"+hour:hour)+":"+(minute<10?"0"+minute:minute)+":"+(second<10?"0"+second:second); return thisTime; }; $scope.dayTime = $scope.getDayTime(); $scope.queryData = function(){ var timer = $interval(function(){ $scope.count++; console.log($scope.count); },4000); $scope.$on("destroy",function(){ $interval.cancel($scope.timer); }); }; }); </script> </head> <body ng-app="btnApp"> <div ng-controller="btnCon"> <button ng-click="queryData();">查询</button> <div> <label>{{count}}</label> </div> </div> </body> </html> 3、问题结果 4、解决源码 5、解决结果 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |
相关内容
- 从scala应用程序执行shell脚本
- RFC1542:Clarifications and Extensions for the Bootstra
- 如何使用$scope $watch和$scope $apply in AngularJS?
- twitter-bootstrap – 降低bootstrap 3.0 navbar的高度
- 单元测试 – 用茉莉花和羯磨测试模块化AngularJS
- scala – 在抽象方法的实现上使用override关键字
- 斯卡拉 – 任何人都能给我一个很好的例子吗?这种关于“什么
- angularjs – 角度ui-grid/ng-grid filter更换频繁
- 构建基于CXF的WebService服务
- vim – 如何使用system()函数的第二个参数(输入)