AngularJs 延时器、计时器实例代码


Posted in Javascript onSeptember 16, 2017

1.$timeout延时器

apptest.controller("main",function($scope,$timeout){
  $scope.pink="pink";
  $scope.box="第二个盒子";
  $timeout(function(){
   $scope.pink="第一个盒子内容,延迟两秒后改变了";
  },2000);
setTimeout(function(){
  $scope.pink="第一个盒子内容,延迟3秒后改变了";
   $scope.$apply();//手动更新视图
},3000);
}

2.$interval计时器

//计时器
var timer= $interval(function(){
   console.log(1);
 },1000);
//清除计时器
 $interval.cancel(timer);

点击不可用

<button ng-click="clickb()" ng-disabled="flag">{{num}}</button>
$scope.flag=false;
$scope.clickb=(function(){
  $scope.flag=true;
  $scope.num=5;
  var int = $interval(function(){
    $scope.num--;
    if($scope.num==-1){
      $scope.flag=false;
      $scope.num="点击倒计时5秒";
      $interval.cancel(int);
    }
  },1000);
});

总结

以上所述是小编给大家介绍的AngularJs 延时器、计时器实例代码,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!

Javascript 相关文章推荐
JavaScript中__proto__与prototype的关系深入理解
Dec 04 Javascript
node.js中watch机制详解
Nov 17 Javascript
js简单工厂模式用法实例
Jun 30 Javascript
javascript中利用柯里化函数实现bind方法
Apr 29 Javascript
使用jquery提交form表单并自定义action的实现代码
May 25 Javascript
如何提高javascript加载速度
Dec 26 Javascript
javascript数据类型详解
Feb 07 Javascript
AngularJS中ng-class用法实例分析
Jul 06 Javascript
Angular17之Angular自定义指令详解
Jan 21 Javascript
使用express来代理服务的方法
Jun 21 Javascript
原生js无缝轮播插件使用详解
Mar 09 Javascript
全局安装 Vue cli3 和 继续使用 Vue-cli2.x操作
Sep 08 Javascript
引入JavaScript时alert弹出框显示中文乱码问题
Sep 16 #Javascript
Javascript 严格模式use strict详解
Sep 16 #Javascript
ES6中Array.copyWithin()函数的用法实例详解
Sep 16 #Javascript
JS闭包的几种常见形式实例详解
Sep 16 #Javascript
ES6中Array.find()和findIndex()函数的用法详解
Sep 16 #Javascript
详解JS构造函数中this和return
Sep 16 #Javascript
Angular使用Md5加密的解决方法
Sep 16 #Javascript
You might like
深入解析yii权限分级式访问控制的实现(非RBAC法)
2013/06/13 PHP
php隐藏IP地址后两位显示为星号的方法
2014/11/21 PHP
php实现高效获取图片尺寸的方法
2014/12/12 PHP
php获取当前url地址的方法小结
2017/01/10 PHP
Laravel5.7框架安装与使用学习笔记图文详解
2019/04/02 PHP
Firefox中autocomplete=&quot;off&quot; 设置不起作用Bug的解决方法
2011/03/25 Javascript
基于JQuery实现异步刷新的代码(转载)
2011/03/29 Javascript
让新消息在网页标题闪烁提示的jQuery代码
2013/11/04 Javascript
jquery实现图片按比例缩放示例
2014/07/01 Javascript
Javascript中For In语句用法实例
2015/05/14 Javascript
jquery显示loading图片直到网页加载完成的方法
2015/06/25 Javascript
详解JavaScript编程中正则表达式的使用
2015/10/25 Javascript
教你用javascript实现随机标签云效果_附代码
2016/03/16 Javascript
关于JS中match() 和 exec() 返回值和属性的测试
2016/03/21 Javascript
JavaScript学习笔记整理_简单实现枚举类型,扑克牌应用
2016/09/19 Javascript
Bootstrap进度条实现代码解析
2017/03/07 Javascript
Javascript别踩白块儿(钢琴块儿)小游戏实现代码
2017/07/20 Javascript
Angular动态绑定样式及改变UI框架样式的方法小结
2018/09/03 Javascript
jdk1.8+vue elementui实现多级菜单功能
2020/09/24 Javascript
[01:21:07]EG vs Liquid 2018国际邀请赛淘汰赛BO3 第一场 8.25
2018/08/29 DOTA
Python 代码性能优化技巧分享
2012/08/07 Python
Python学习笔记之os模块使用总结
2014/11/03 Python
Python编程中用close()方法关闭文件的教程
2015/05/24 Python
python实现烟花小程序
2019/01/30 Python
python scatter散点图用循环分类法加图例
2019/03/19 Python
python利用wx实现界面按钮和按钮监听和字体改变的方法
2019/07/17 Python
python实现一个函数版的名片管理系统过程解析
2019/08/27 Python
localstorage和sessionstorage使用记录(推荐)
2017/05/23 HTML / CSS
借款协议书范本
2014/04/22 职场文书
介绍长城的导游词
2015/01/30 职场文书
环卫个人总结
2015/03/03 职场文书
《中国古代诗歌散文欣赏》高中语文教材
2019/08/20 职场文书
oracle通过存储过程上传list保存功能
2021/05/12 Oracle
详解MySQL多版本并发控制机制(MVCC)源码
2021/06/23 MySQL
JavaScript最完整的深浅拷贝实现方式详解
2022/02/28 Javascript
sql查询语句之平均分、最高最低分及排序语句
2022/05/30 MySQL