AngularJS中$timeout和$interval的用法详解
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"],里面有很多不错的文章。
转载于:https://www.cnblogs.com/moli-/p/5827618.html
AngularJS中$timeout和$interval的用法详解相关推荐
- CreateThread用法详解
CreateThread用法详解 今天我给大家讲一讲C++中的多线程编程技术,C++本身并没有提供任何多线程机制,但是在windows下,我们可以调用SDK win32 api来编写多线程的程序,下面 ...
- php theme_path,PHP_Yii2主题(Theme)用法详解,本文实例讲述了Yii2主题(Theme) - phpStudy
Yii2主题(Theme)用法详解 本文实例讲述了Yii2主题(Theme)用法.分享给大家供大家参考,具体如下: 首先看看主要的配置方式: 'components' => [ 'view' = ...
- PowerShell攻防进阶篇:nishang工具用法详解
PowerShell攻防进阶篇:nishang工具用法详解 导语:nishang,PowerShell下并肩Empire,Powersploit的神器. 开始之前,先放出个下载地址! 下载地址:htt ...
- Linux Shell脚本入门--wget 命令用法详解
Linux Shell脚本入门--wget 命令用法详解 wget是在Linux下开发的开放源代码的软件,作者是Hrvoje Niksic,后来被移植到包括Windows在内的各个平台上.它有以下功能 ...
- Java语言Socket接口用法详解
Socket接口用法详解 在Java中,基于TCP协议实现网络通信的类有两个,在客户端的Socket类和在服务器端的ServerSocket类,ServerSocket类的功能是建立一个Serve ...
- windows 7编辑启动菜单 bcdedit linux,bcdedit用法详解 windows7/vista启动修改
bcdedit用法详解 windows7/vista启动修改 (2010-09-11 19:27:28) 标签: 杂谈 bcdedit用法详解 在Vista/2008下,我们通过msconfig的&q ...
- ES6 — Promise基础用法详解(resolve、reject、then、catch,all,)
ES6 - Promise基础用法详解 Promise 是一个构造函数,它自身拥有all.reject.resolve这几个眼熟的方法, 原型上有then.catch等同样熟悉的方法. 所以,在开始一 ...
- Future 用法详解
Future 用法详解 前言 其他知识点 Java 多线程基础 深入理解aqs ReentrantLock用法详解 深入理解信号量Semaphore 深入理解并发三大特性 并发编程之深入理解CAS 深 ...
- java的wait_java wait()方法用法详解
一.wait(), notify(), notifyAll()等方法介绍 1.wait()的作用是让当前线程进入等待状态,同时,wait()也会让当前线程释放它所持有的锁."直到其他线程调用 ...
最新文章
- 阻燃防火电缆在数据中心建设中的应用
- Win32汇编环境搭建教程(MASM32 SDK)
- 服务器操作系统文件共享设置,服务器操作系统文件共享设置
- SpringBoot集成Elasticsearch实现博客高亮搜索
- 对视觉任务更友好的Transformer,北航团队开源Visformer!
- python爬虫京东评论_python爬京东评论
- 编写 Struts2 程序 的三个步骤 手动配置
- 银行传统支付通道与支付平台结合
- 移动pc多平台运营级家校互动平台系统源码转让
- Java菜鸟的初次实习经历
- 载入java VM时windows出现错误:2 的解决方法
- 十年老撕鸡分享,五分钟搭建个人轻论坛
- 解决页眉下划线与边框重复问题:设置页眉并保持好“距离“
- thrift文件服务器,Thrift功能和使用
- STM32F4 RTC详解
- 多平台epub阅读器分享
- 为什么抖音账号作品很少粉丝却很多,抖音删除的粉丝还能看到吗
- 测试藏宝图汉化版大图
- 重温Python基础——列表
- MATLAB 学习笔记(2)MATLAB 矩阵的加减乘除运算
热门文章
- ac3168无线网卡驱动下载_计算机基础:网卡
- 地址栏引用PHP中变量,PHP 读取地址栏 参数
- zookeeper清空hbase_HBase在zookeeper下不创建目录
- aix 查看防火墙状态_aix防火墙怎么样设置
- 图表下面的文字怎么变竖排_Excel中如何制作多维组合图表?
- 右手残疾学计算机学什么专业好,我是右手和右脚残疾 左手和左脚好的 可以学残疾人驾照吗...
- Linux下hba卡驱动的卸载,SLES11下如何重装qlogic FC HBA卡驱动
- design php 如何使用ant_Ant Design Pro如何调用接口 | Ant Design Pro渲染数据 绑定数据...
- Android的setVisibility的三个参数
- 20190828:(leetcode习题)回文链表