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 脚本将当地时间转换成其它时区
Mar 19 Javascript
Bootstrap导航条可点击和鼠标悬停显示下拉菜单的实现代码
Jun 23 Javascript
常用js,css文件统一加载方法(推荐) 并在加载之后调用回调函数
Sep 23 Javascript
javascript 显示全局变量与隐式全局变量的区别
Feb 09 Javascript
Node.js 异步异常的处理与domain模块解析
May 10 Javascript
vue.js 底部导航栏 一级路由显示 子路由不显示的解决方法
Mar 09 Javascript
node实现socket链接与GPRS进行通信的方法
May 20 Javascript
解决layui的input独占一行的问题
Sep 10 Javascript
解决vue+router路由跳转不起作用的一项原因
Jul 19 Javascript
Vue中的this.$options.data()和this.$data用法说明
Jul 26 Javascript
解决vue+elementui项目打包后样式变化问题
Aug 03 Javascript
vue实现列表拖拽排序的功能
Nov 02 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开发中四种查询返回结果分析
2011/01/02 PHP
PHP中usort在值相同时改变原始位置问题的解决方法
2011/11/27 PHP
php在线解压ZIP文件的方法
2014/12/30 PHP
详解js异步文件加载器
2016/01/24 PHP
php用xpath解析html的代码实例讲解
2019/02/14 PHP
PHP页面静态化――纯静态与伪静态用法详解
2020/06/05 PHP
javascript实现可改变滚动方向的无缝滚动实例
2013/06/17 Javascript
javascript将相对路径转绝对路径示例
2014/03/14 Javascript
Jquery节点遍历next与nextAll方法使用示例
2014/07/22 Javascript
jQuery对象和DOM对象之间相互转换的方法介绍
2015/02/28 Javascript
再JavaScript的jQuery库中编写动画效果的指南
2015/08/13 Javascript
轻松实现js图片预览功能
2016/01/18 Javascript
基于BootStrap Metronic开发框架经验小结【六】对话框及提示框的处理和优化
2016/05/12 Javascript
url传递的参数值中包含&amp;时,url自动截断问题的解决方法
2016/08/02 Javascript
基于jQuery实现图片推拉门动画效果的两种方法
2017/08/26 jQuery
JS实现页面内跳转的简单代码
2017/09/03 Javascript
NodeJS实现视频转码的示例代码
2017/11/18 NodeJs
如何在vue中使用ts的示例代码
2018/02/28 Javascript
python中星号变量的几种特殊用法
2016/09/07 Python
python with提前退出遇到的坑与解决方案
2018/01/05 Python
python使用threading.Condition交替打印两个字符
2019/05/07 Python
python多线程+代理池爬取天天基金网、股票数据过程解析
2019/08/13 Python
python ftplib模块使用代码实例
2019/12/31 Python
45个非常奇妙的CSS3 特性应用示例
2012/01/01 HTML / CSS
HTML5 和小程序实现拍照图片旋转、压缩和上传功能
2018/10/08 HTML / CSS
Melissa鞋马来西亚官方网站:MDreams马来西亚
2018/04/05 全球购物
Clarks鞋澳大利亚官方网站:Clarks Australia
2019/12/25 全球购物
澳大利亚最大的护发和护肤品购物网站:RY
2019/12/26 全球购物
飞利浦西班牙官方网站:Philips西班牙
2020/02/17 全球购物
承诺书的格式范文
2014/03/28 职场文书
倡议书格式范文
2014/04/14 职场文书
代办委托书怎么写
2014/08/01 职场文书
画展观后感
2015/06/17 职场文书
《走遍天下书为侣》教学反思
2016/02/22 职场文书
30岁前绝不能错过的10本书
2019/08/08 职场文书
熟背这些句子,让您的英语口语突飞猛进(135句)
2019/09/06 职场文书