本文转自:http://www.cnblogs.com/moli-/p/5827618.html

1. 先将$interval,$timeout,作为参数注入到controller中,例如rds.controller('controllerCtrl', ['app', '$scope','$http','$routeParams','$filter','$location','$interval','$timeout',

    function (app, $scope,$http,$routeParams,$filter,$location,$interval,$timeout) { 2.在需要用的地方写上该方法 例如  $scope.timer = $interval( function(){
    $scope.backup("1");   }, 10000);
一开始以为是把需要调用的方法直接写在function(){}的位置,发现方法走到定时器时直接执行了该方法并没有循环执行,后来发现需要把需要调用的方法写在function内,10000表示10秒循环一次.如果要定义循环次数 只需要写成如下这样 $scope.timer = $interval( function(){
    $scope.backup("1");   }, 10000,3); 3代表循环3次就自动停止循环了.
3.终止定时器 $interval.cancel($scope.timer);
4.$timeout的用法也类似 ,只是$timeout是延迟多少秒后循环一次,而$interval是每隔多少秒循环一次,如果不终止就一直循环
下面是摘自博客 比较高大上的介绍

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


												

[转]AngularJS中$timeout和$interval的用法详解的更多相关文章

  1. AngularJS中$timeout和$interval的用法详解

    1. 先将$interval,$timeout,作为参数注入到controller中,例如rds.controller('controllerCtrl', ['app', '$scope','$htt ...

  2. AngularJS select中ngOptions用法详解

    AngularJS select中ngOptions用法详解   一.用法 ngOption针对不同类型的数据源有不同的用法,主要体现在数组和对象上. 数组: label for value in a ...

  3. mysql中event的用法详解

    一.基本概念mysql5.1版本开始引进event概念.event既“时间触发器”,与triggers的事件触发不同,event类似与linux crontab计划任务,用于时间触发.通过单独或调用存 ...

  4. Java语言Socket接口用法详解

    Socket接口用法详解   在Java中,基于TCP协议实现网络通信的类有两个,在客户端的Socket类和在服务器端的ServerSocket类,ServerSocket类的功能是建立一个Serve ...

  5. oracle数据库定时任务dbms_job的用法详解

    本文来源:Ruthless <oracle数据库定时任务dbms_job的用法详解> 一.dbms_job涉及到的知识点   1.创建job: variable jobno number; ...

  6. [转]使用python来操作redis用法详解

    转自:使用python来操作redis用法详解 class CommRedisBase(): def __init__(self): REDIS_CONF = {} connection_pool = ...

  7. Linux Shell脚本入门--wget 命令用法详解

    Linux Shell脚本入门--wget 命令用法详解 wget是在Linux下开发的开放源代码的软件,作者是Hrvoje Niksic,后来被移植到包括Windows在内的各个平台上.它有以下功能 ...

  8. 【python】redis基本命令和基本用法详解

    [python]redis基本命令和基本用法详解 来自http://www.cnblogs.com/wangtp/p/5636872.html 1.redis连接 redis-py提供两个类Redis ...

  9. (转)linux traceroute命令参数及用法详解--linux跟踪路由命令

    linux traceroute命令参数及用法详解--linux跟踪路由命令 原文:http://blog.csdn.net/liyuan_669/article/details/25362505 通 ...

随机推荐

  1. mac下的抓包工具 -- Charles

    # 背景 换了mac电脑,

  2. MVVM前端框架

    早开始接触MVVM框架的时候,是在学习WPF的时候,后面陆陆续续接触到了很多的前端JS框架,个人觉得大同小异,也没有去研究源代码,所以都停留在使用的阶段.当然对于我来说,使用这些JS框架,最关注的无非 ...

  3. ASP.NET MVC Ajax 伪造请求

    1.前言 CSRF(Cross-site request forgery)跨站请求伪造,ASP.NET MVC 应用通过使用AJAX请求来提升用户体验,浏览器开发者工具可以一览众山小,就很容易伪造了请 ...

  4. 初探angluar_01 目录结构分析及初始化项目

    简单说明:angular是模块化的,因此所有功能功能都属于组件 一.目录结构 e2e 端到端的测试目录  用来做自动测试的 node_modules 安装地依赖存放目录,package.json里安装 ...

  5. K8S+GitLab-自动化分布式部署ASP.NET Core(一) 部署环境

    一.部署流程介绍 开发人员通过Git上传asp.net core 项目到Gilab,并编写好.gitlab-ci.yml , GitLab-Runner 自动拉取代码,然后进行Build,编译,单元测 ...

  6. 构建NetCore应用框架之实战篇(三):BitAdminCore框架功能规划选择

    本篇承接上篇内容,如果你不小心点击进来,建议从第一篇开始完整阅读,文章内容继承性连贯性. 构建NetCore应用框架之实战篇系列 一.BitAdminCore功能规划 如何选择框架的落地功能,前篇文章 ...

  7. [5.19 线下活动]Docker Meetup杭州站—拥抱Kubernetes,容器深度实践

    对本次线下活动感兴趣的朋友,欢迎点击此处报名,领取免费票. 今年3月,Docker刚刚过完5岁生日,五年期间,Docker也逐渐在技术和实践方面趋于成熟,更是在去年年底主动拥抱Kubernetes. ...

  8. Cordova - 解决升级NDK之后无法编译!

    先前Cordova工作正常,今天升级了一下Android Studio,随后发现NDK也有升级包了,于是顺利升级了NDK!升级完毕发现,无法正常编译了,错误提示如下: No toolchains fo ...

  9. 【bug】使用微信分享SDK,配置成功但分享信息异常

    使用微信JSD做H5分享功能时,显示配置成功,但分享出去的信息并不是配置中的信息.(p.s. ios 分享后只有一个当前的链接,androd连分享的图标都没有), 最终找的的原因是:分享的链接中,参数 ...

  10. 《Vue 编程房内考》

    古人有云:码农爱coding,则为之计深远. 众人问:何为之? 古人曰:底层.算法和架构. 众木然. 古人又曰:多看源码. 以下内容是我在学习 Vue-2.5.2 源码时的一个总结. 第一章 活捉Vu ...