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

 更新时间:2017年09月16日 14:41:41   作者:莫_莫  
这篇文章主要介绍了AngularJs 延时器、计时器实例代码,需要的朋友可以参考下

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 延时器、计时器实例代码,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!

相关文章

  • AngularJS语法详解

    AngularJS语法详解

    本文通过示例向大家介绍了AngularJS语法的使用,小伙伴们认真研读下吧,非常的实用哦。
    2015-01-01
  • AngularJS基础学习笔记之控制器

    AngularJS基础学习笔记之控制器

    在AngularJS中,控制器是一个Javascript函数(类型/类),用来增强除了根作用域意外的作用域实例的。当你或者AngularJS本身通过<code>scope.$new</code>俩创建一个新的子作用域对象时,有一个选项能让你将它当做参数传递给控制器。
    2015-05-05
  • 盘点分析Angular框架那些著名的安全漏洞

    盘点分析Angular框架那些著名的安全漏洞

    这篇文章主要为大家介绍了盘点分析Angular框架那些著名的安全漏洞,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-10-10
  • Angular 4依赖注入学习教程之组件服务注入(二)

    Angular 4依赖注入学习教程之组件服务注入(二)

    大家都知道依赖注入式AngularJS的重要特性之一,之前我们已经介绍了关于Angular 4依赖注入基础的内容,下面这篇文章主要给大家介绍了关于Angular 4依赖注入之组件服务注入的相关资料,需要的朋友可以参考借鉴,下面来一起看看吧。
    2017-06-06
  • angular2中使用第三方js库的实例

    angular2中使用第三方js库的实例

    下面小编就为大家分享一篇angular2中使用第三方js库的实例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-02-02
  • 详解AngularJS如何实现跨域请求

    详解AngularJS如何实现跨域请求

    跨域请求一直是网页编程中的一个难题,在过去,绝大多数人都倾向于使用JSONP来解决这一问题。不过现在,我们可以考虑一下W3C中一项新的特性——CORS(Cross-Origin Resource Sharing)了。
    2016-08-08
  • 在Angular中实现一个级联效果的下拉框的示例代码

    在Angular中实现一个级联效果的下拉框的示例代码

    这篇文章主要介绍了在Angular中实现一个级联效果的下拉框的示例代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-05-05
  • Angular2 自定义validators的实现方法

    Angular2 自定义validators的实现方法

    angular 当需要form表单需要验证时,angular自带了许多校验器,但是很多时候自带的无法满足业务需求,这时候就需要自定义的校验器,下面通过本文给大家分享Angular2 自定义validators的实现方法,需要的朋友参考下吧
    2017-07-07
  • AngularJS ng-controller 指令简单实例

    AngularJS ng-controller 指令简单实例

    本文主要介绍AngularJS ng-controller 指令,这里对ng-controller指令资料的整理,并附代码示例和效果图,有需要的朋友看下
    2016-08-08
  • 如何用DevUI搭建自己的Angular组件库

    如何用DevUI搭建自己的Angular组件库

    DevUI 是一款面向企业中后台产品的开源前端解决方案,它倡导沉浸、灵活、至简的设计价值观,提倡设计者为真实的需求服务,为多数人的设计,拒绝哗众取宠、取悦眼球的设计。如果你正在开发 ToB 的工具类产品,DevUI 将是一个很不错的选择!
    2021-05-05

最新评论