博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
AngularJs $interval 和 $timeout
阅读量:6836 次
发布时间:2019-06-26

本文共 1502 字,大约阅读时间需要 5 分钟。

$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那样使用,一些使用小技巧可以用在浏览器单线程的事件执行方面...  详情推荐看破狼的文章“”,也可以关注其微信公众号["shuang_lang_shuo"],里面有很多不错的文章。

转载地址:http://ythkl.baihongyu.com/

你可能感兴趣的文章
c++.net 托管类封装非托管类
查看>>
剑指offer系列之十:二进制中1的个数
查看>>
对技术的一点点看法
查看>>
用 Dagger 2 实现依赖注入
查看>>
浅析散列存储
查看>>
精读《Function VS Class 组件》
查看>>
关于startActivityForResult
查看>>
关于如何用100行如何实现docker
查看>>
Redis SLAVE过期键策略
查看>>
【PHP 开发】mac 下配置 PHP 环境的方法
查看>>
快收藏!52篇25万字,微服务、云原生、容器、K8S、Serverless精华文章集锦
查看>>
Glide加载gif图片优化
查看>>
C++ 基本数据类型
查看>>
面试笔记(2.JS
查看>>
在标签使用onclick(this)来传递参数
查看>>
做数据科学领域的「召唤师」,组织一场人人可参与的数据科学比赛
查看>>
Express 搭建web服务器
查看>>
Github 的 Pull Request 教程
查看>>
SmartRules让MindManager的交互图变得更加智能
查看>>
如何使用React动态添加/删除class来改变样式
查看>>