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 相关文章推荐
谷歌浏览器 insertCell与appendChild的区别
Feb 12 Javascript
用JavaScript修改CSS属性的代码
May 06 Javascript
jqeury-easyui-layout问题解决方法
Mar 24 Javascript
angular2使用简单介绍
Mar 01 Javascript
深入理解setTimeout函数和setInterval函数
May 20 Javascript
js 获取元素所有兄弟节点的实现方法
Sep 06 Javascript
JS中利用FileReader实现上传图片前本地预览功能
Mar 02 Javascript
对Angular中单向数据流的深入理解
Mar 31 Javascript
小程序实现选择题选择效果
Nov 04 Javascript
Vue.js + Nuxt.js 项目中使用 Vee-validate 表单校验
Apr 22 Javascript
vue-以文件流-blob-的形式-下载-导出文件操作
Aug 07 Javascript
Vue自定义组件双向绑定实现原理及方法详解
Sep 03 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
PHP去掉从word直接粘贴过来的没有用格式的函数
2012/10/29 PHP
深入PHP与浏览器缓存的分析
2013/06/03 PHP
php多个字符串替换成同一个的解决方法
2013/06/18 PHP
ThinkPHP中pathinfo的访问模式、路径访问模式及URL重写总结
2014/08/23 PHP
php使用GD库创建图片缩略图的方法
2015/06/10 PHP
php设计模式之策略模式应用案例详解
2019/06/17 PHP
javascript笔记 String类replace函数的一些事
2011/09/22 Javascript
使用apply方法处理数组的三个技巧[译]
2012/09/20 Javascript
js将当前时间格式转换成时间搓(自写)
2013/09/26 Javascript
Javascript操作URL函数修改版
2013/11/07 Javascript
Javascript实现计算个人所得税
2015/05/10 Javascript
jquery插件jquery.beforeafter.js实现左右拖拽分隔条对比图片的方法
2015/08/07 Javascript
AngularJS入门教程之服务(Service)
2016/07/27 Javascript
AjaxUpLoad.js实现文件上传功能
2018/03/02 Javascript
详解如何使用router-link对象方式传递参数?
2019/05/02 Javascript
javascript关于“时间”的一次探索
2019/07/24 Javascript
原生JavaScript之es6中Class的用法分析
2020/02/23 Javascript
Nuxt.js的路由跳转操作(页面跳转nuxt-link)
2020/11/06 Javascript
js前端对于大量数据的展示方式及处理方法
2020/12/02 Javascript
Cython 三分钟入门教程
2009/09/17 Python
Python正则表达式匹配ip地址实例
2014/10/09 Python
Python调用C语言的方法【基于ctypes模块】
2018/01/22 Python
用Python实现筛选文件脚本的方法
2018/10/27 Python
python自动化实现登录获取图片验证码功能
2019/11/20 Python
win10安装tensorflow-gpu1.8.0详细完整步骤
2020/01/20 Python
python GUI库图形界面开发之PyQt5结合Qt Designer创建信号与槽的详细方法与实例
2020/03/08 Python
序列化Python对象的方法
2020/08/01 Python
澳大利亚领先的折扣药房:Chemist Direct(有中文站)
2018/11/24 全球购物
平面设计自荐信
2013/10/07 职场文书
初中学校对照检查材料
2014/08/19 职场文书
优秀班主任主要事迹材料
2014/12/16 职场文书
雨花台导游词
2015/02/06 职场文书
简短清晨问候语
2015/11/10 职场文书
2016党风廉政建设心得体会范文
2016/01/25 职场文书
使用nginx动态转换图片大小生成缩略图
2021/03/31 Servers
MySQL中一条SQL查询语句是如何执行的
2022/04/08 MySQL