<body>
<div ng-app="myApp">
<div ng-controller="firstController">
<input type="button" ng-value ="text" ng-disabled="isDisable"/> <input type="text" value="{{text}}" ng-readonly="isDisable" /> <input type="checkbox" value="{{text}}" ng-checked="isDisable" />
</div>
</div>
<script type="text/javascript">
var app = angular.module("myApp", []); app.controller('firstController', ['$scope', '$interval', function ($scope, $interval) { $scope.n = 10;
$scope.text = $scope.n + "秒";
$scope.isDisable = true; var time = $interval(function () { $scope.n--;
$scope.text = $scope.n + "秒";
if ($scope.n == 0)
{
$interval.cancel(time);
$scope.isDisable = false;
$scope.text = "可以点击";
} },1000); }]); </script> </body>

AngularJS - 定时器 倒计时例子的更多相关文章

  1. Flutter 快速上手定时器/倒计时及实战讲解

    本文微信公众号「AndroidTraveler」首发. 今天给大家讲讲 Flutter 里面定时器/倒计时的实现. 一般有两种场景: 我只需要你在指定时间结束后回调告诉我.回调只需要一次. 我需要你在 ...

  2. AngularJS directive入门例子

    这是<AngularJS>这本书里面提供的一个例子: JS代码: var expanderModule=angular.module('expanderModule', []) expan ...

  3. Bom 基本使用以及定时器 倒计时案例

    BOM 是浏览器对象模型 它提供了独立内容而与浏览器窗口进行交互的对象,其核心对象是window 窗口加载事件 注意:window.onload 就可以吧JS代码写在页面元素的上方,因为onload是 ...

  4. JavaScript-setInterval-周期性行定时器-倒计时

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  5. pyqt之倒计时例子

    from PyQt4.Qt import *from PyQt4.QtCore import *from PyQt4.QtGui import *import sysdef main():    a= ...

  6. hrtimer 高精定时器使用例子

    在kernel,有个线程每个十秒往上层系统上报battery及USB的状态信息. 加入直接sleep 10 秒的话,插入USB的时候不能及时更新状态,这个时候就可以使用 hrtimer + wait ...

  7. XX出行项目子系统-统计系统设计(定时器项目设计例子)

    一. 引言 目前开发的XX出行系统,需要开发数据统计功能,鉴于约约出行系统已经在运营,并且有新版本的迭代,方便以后下个版本复用,遂新建一个子系统. 二. 架构设计 三. 具体实现 1.MySql数据库 ...

  8. AngularJS定时器任务

    由于项目需要监测用户在线时长,所以用定时器来实现. /*计算在线时长,一分钟执行一次*/ var stopEvent = $interval(function(){ //每分钟执行一次定时任务 $sc ...

  9. AngularJS中Route例子

    代码:https://files.cnblogs.com/files/xiandedanteng/angularJSRouteSample.rar 点击‘首页’后: 点击‘电脑’后: <!DOC ...

随机推荐

  1. [Web API] 如何让 Web API 统一回传格式以及例外处理

    [Web API] 如何让 Web API 统一回传格式以及例外处理 前言 当我们在开发 Web API 时,一般的情况下每个 API 回传的数据型态或格式都不尽相同,如果你的项目从头到尾都是由你一个 ...

  2. C# 空值判断

    (1)NULL null 关键字是表示不引用任何对象的空引用的文字值.null 是引用类型变量的默认值.那么也只有引用型的变量可以为NULL,如果 int i=null,的话,是不可以的,因为Int是 ...

  3. [LeetCode] Ugly Number (A New Question Added Today)

    Write a program to check whether a given number is an ugly number. Ugly numbers are positive numbers ...

  4. bzoj 3143 [Hnoi2013]游走(贪心,高斯消元,期望方程)

    [题目链接] http://www.lydsy.com/JudgeOnline/problem.php?id=3143 [题意] 给定一个无向图,从1走到n,走过一条边得到的分数为边的标号,问一个边的 ...

  5. ramips芯片,openwrt安装njit8021xclient

    1.软件安装包 http://pan.baidu.com/s/1tcY2p 解压并通过winscp上传至路由器,利用putty进入控制台,依次输入以下4条命令,每次输入后点一次执行opkg insta ...

  6. git使用中遇到的常见问题

    .gitignore 中添加的文件不能被忽略掉 这是因为我们误解了 .gitignore 文件的用途,该文件只能作用于 Untracked Files,也就是那些从来没有被 Git 记录过的文件(自添 ...

  7. 内存映射文件详解-----C++实现

    先不说内存映射文件是什么.贴个代码先,. #include <iostream> #include <fcntl.h> #include <io.h> #inclu ...

  8. VHDL的testbench的编写(转)

    大多数硬件设计人员对verilog的testbench比较熟悉,那是因为verilog被设计出来的目的就是为了用于测试使用,也正是因为这样verilog的语法规则才被设计得更像C语言,而verilog ...

  9. kettle内存溢出

    ETL工具kettle,在老版设计后,使用新版时,居然发生了内存溢出的错误: 出现: java heap 或者 OutOfMemory等字样 这是kettle分配的内存不足. 在kettle的运行路径 ...

  10. android开发教程(八)——环境搭建之java-ndk

    目录 android ndk是android用于开发本地代码的开发工具包.它提供C/C++交叉编译工具.android内核.驱动.已有的C/C++代码,都需要ndk来支持开发. 目前支持以下平台:ar ...