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 相关文章推荐
wordpress之js库集合研究介绍
Aug 17 Javascript
js异或加解密效果代码
Jun 25 Javascript
jQuery动态显示和隐藏datagrid中的某一列的方法
Dec 11 Javascript
jQuery实现可展开合拢的手风琴面板菜单
Sep 15 Javascript
MUI 解决动态列表页图片懒加载再次加载不成功的bug问题
Apr 13 Javascript
基于vue+ bootstrap实现图片上传图片展示功能
May 17 Javascript
JavaScript模板引擎实现原理实例详解
Dec 14 Javascript
JS+CSS实现随机点名(实例代码)
Nov 04 Javascript
详解vue页面首次加载缓慢原因及解决方案
Nov 06 Javascript
json解析大全 双引号、键值对不在一起的情况
Dec 06 Javascript
element-ui table行点击获取行索引(index)并利用索引更换行顺序
Feb 27 Javascript
jQuery使用ajax传递json对象到服务端及contentType的用法示例
Mar 12 jQuery
引入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
图象函数中的中文显示
2006/10/09 PHP
php数组函数序列之in_array() 查找数组值是否存在
2011/10/29 PHP
微信营销平台系统?刮刮乐的开发
2014/06/10 PHP
PHP使用gmdate实现将一个UNIX 时间格式化成GMT文本的方法
2015/03/19 PHP
php中array_fill函数的实例用法
2021/03/02 PHP
JS Timing
2007/04/21 Javascript
javascript 获取select下拉列表值的代码
2009/09/07 Javascript
js阻止默认事件与js阻止事件冒泡示例分享 js阻止冒泡事件
2014/01/27 Javascript
Jquery节点遍历next与nextAll方法使用示例
2014/07/22 Javascript
网页禁用右键菜单和鼠标拖动选择方法小结
2015/02/25 Javascript
Angularjs全局变量被作用域监听的正确姿势
2016/02/06 Javascript
DOM操作和jQuery实现选项移动操作的简单实例
2016/06/07 Javascript
JS实现获取当前URL和来源URL的方法
2016/08/24 Javascript
超全面的vue.js使用总结
2017/02/12 Javascript
vue.js实现带日期星期的数字时钟功能示例
2018/08/28 Javascript
解决v-for中使用v-if或者v-bind:class失效的问题
2018/09/25 Javascript
antd-日历组件,前后禁止选择,只能选中间一部分的实例
2020/10/29 Javascript
vue实现动态表格提交参数动态生成控件的操作
2020/11/09 Javascript
[46:57]EG vs Winstrike 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
详解Python中的__init__和__new__
2014/03/12 Python
Python:Scrapy框架中Item Pipeline组件使用详解
2017/12/27 Python
numpy.transpose对三维数组的转置方法
2018/04/17 Python
利用Python求阴影部分的面积实例代码
2018/12/05 Python
Python可变和不可变、类的私有属性实例分析
2019/05/31 Python
python web框架中实现原生分页
2019/09/08 Python
Python搭建代理IP池实现检测IP的方法
2019/10/27 Python
python从zip中删除指定后缀文件(推荐)
2019/12/05 Python
使用Python给头像加上圣诞帽或圣诞老人小图标附源码
2019/12/25 Python
Gap工厂店:Gap Factory
2017/11/02 全球购物
eVitamins日本:在线购买折扣维生素、补品和草药
2019/04/04 全球购物
Sperry澳大利亚官网:源自美国帆船鞋创始品牌
2019/07/29 全球购物
金属材料工程个人求职的自我评价
2013/12/04 职场文书
第二批党的群众路线教育实践活动个人对照检查材料
2014/09/23 职场文书
python实现大文本文件分割成多个小文件
2021/04/20 Python
Java实现简易的分词器功能
2021/06/15 Java/Android
如何使用分区处理MySQL的亿级数据优化
2021/06/18 MySQL