$interval是 window.setInterval的Angular包装形式。$interval指每次延迟时间后执行响应的函数(也可以说:每次执行函数的间隔时间)。$interval多数用于计时器
备注:当你执行完这项服务后应该把它销毁。特别是当controller或者directive元素被销毁时而$interval未被销毁。你应该考虑到在适当的时候取消interval事件。
$interval ( fn , delay , [count] , [invokeApply] , [Pass] );
fn: 一个将被反复执行的函数。 delay: 每次调用的间隔毫秒数值。 count: 循环次数的数值,如果没设置,则无限制循环。 invokeApply: 如果设置为false,则避开脏值检查,否则将调用$apply。 Pass: 函数的附加参数。
timeout函数的返回值是一个promise,当到达设置的超时时间时,这个承诺将被解决,并执行timeout函数。 $timeout多数用于事件延迟(延迟多长时间后,处理什么事情)
如果想要取消timeout,需要调用$timeout.cancel(promise);$timeout( fn , [delay] , [invokeApply] );
fn:一个将被延迟执行的函数。 delay:延迟的时间(毫秒)。 invokeApply:如果设置为false,则跳过脏值检测,否则将调用$apply。
下面来看一个定时器的例子:
这面截图的例子可用在手机获取验证码的部分功能,其功能的实现就用到了 $interval 定时器,
interval.html
interval.js
var app = angular.module('myApp', []);app.controller('myCtrl', function($scope,$interval) { $scope.canClick=false; $scope.description = "获取验证码"; var second=59; var timerHandler; $scope.getTestCode = function(){ timerHandler =$interval(function(){ if(second<=0){ $interval.cancel(timerHandler); //当执行的时间59s,结束时,取消定时器 ,cancle方法取消 second=59; $scope.description="获取验证码"; $scope.canClick=false; //因为 ng-disabled属于布尔值,设置按钮可以点击,可点击发送 }else{ $scope.description=second+"s后重发"; second--; $scope.canClick=true; } },1000) //每一秒执行一次$interval定时器方法 };});