AngularJs定时器$interval 和 $timeout详解
$interval
window.setinterval的angular包装形式。fn是每次延迟时间后被执行的函数。
间隔函数的返回值是一个承诺。这个承诺将在每个间隔刻度被通知,并且到达规定迭代次数后被取消,如果迭代次数未定义,则无限制的执行。通知的值将是运行的迭代次数。取消一个间隔,调用$intreval.cancel(promise)。
备注:当你执行完这项服务后应该把它销毁。特别是当controller或者directive元素被销毁时而$interval未被销毁。你应该考虑到在适当的时候取消interval事件。
使用:$interval(fn,delay,[count],[invokeapply],[pass]);
fn:一个将被反复执行的函数。
delay:每次调用的间隔毫秒数值。
count:循环次数的数值,如果没设置,则无限制循环。
invokeapply:如果设置为false,则避开脏值检查,否则将调用$apply。
pass:函数的附加参数。
方法:
cancel(promise);
取消与承诺相关联的任务。
promise:$interval函数的返回值。
使用代码:
(function () { angular.module("demo", []) .controller("testctrl",["$interval",testctrl]); function testctrl($interval){ var todo = function () { console.log("hello world"); }; $interval(todo, 3000, 10); }; }());
$timeout
window.settimeout的angular包装形式。fn函数包装成一个try/catch块,代表$exceptionhandler服务里的任何异常。
timeout函数的返回值是一个promise,当到达设置的超时时间时,这个承诺将被解决,并执行timeout函数。
需要取消timeout,需要调用$timeout.cancel(promise);
使用: $timeout(fn,[delay],[invokeapply]);
fn:一个将被延迟执行的函数。
delay:延迟的时间(毫秒)。
invokeapply:如果设置为false,则跳过脏值检测,否则将调用$apply。
方法:
cancel(promise);
取消与承诺相关联的任务。这个的结果是,承诺将被以摒弃方式来解决。
promise:$timeout函数返回的承诺。
(function () { angular.module("demo", []) .controller("testctrl",["$timeout",testctrl]); function testctrl($timeout){ var todo = function () { console.log("hello world"); }; $timeout(todo,5000) }; }());
大致使用方法可以和原生js的setinterval和settimeout那样使用,一些使用小技巧可以用在浏览器单线程的事件执行方面...
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
推荐阅读
-
AngularJS入门教程之REST和定制服务详解
-
AngularJS入门教程之XHR和依赖注入详解
-
详解angularJs模块ui-router之状态嵌套和视图嵌套
-
AngularJs动态加载模块和依赖注入详解
-
详解在Angularjs中ui-sref和$state.go如何传递参数
-
AngularJS中$interval的用法详解
-
详解AngularJs中$resource和restfu服务端数据交互
-
详解angularjs中如何实现控制器和指令之间交互
-
AngularJS中$watch和$timeout的使用示例
-
AngularJs $parse、$eval和$observe、$watch详解