<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>动态时间例子</title>
<script src="js/angular.min.js"></script>
<script>
var app=angular.module("timeDemo",[]);
app.controller("timeCtrl",function($scope){
//获取当前时间
var now1=new Date();
//让时间在页面显示
$scope.Now=now1.getHours()+':'+now1.getMinutes()+':'+now1.getSeconds();

//写一个方法获取当前时间
$scope.SetTimer=function(){
//angularJs的特性，需要手动把变化映射到html元素上面
$scope.$apply(function(){
var now=new Date();
$scope.Now=now.getHours()+':'+now.getMinutes()+':'+now.getSeconds();
});
};
//每隔1秒刷新一次时间
$scope.SetTimerInterval=setInterval($scope.SetTimer,1000);
});
</script>
</head>
<body ng-app="timeDemo" ng-controller="timeCtrl">
当前时间为：{{Now}}
</body>
</html>

angularjs实现时钟效果的更多相关文章

  1. Flash AS实现时钟效果（全脚本实现）

    最近工作中用到个Flash效果,好久没有写FlashAS脚本了,就想从以前写的代码中找一些实例.竟然看到硬盘中还留有若干年前的代码. 这个时钟效果是全部采用脚本实现,图形也是用脚本绘制的.写于2005 ...

  2. transform实现的时钟效果

    又来一个时钟效果了,这个的实现不需要canvas,都是div.ul.li画出的,好玩有真实. 哈哈~ 需要的js才能实现到走动这个效果,但js的内容不多,也不难. 主要是一个css里transform ...

  3. 原生javascript实现网页显示日期时钟效果

    刚接触javascript中Date内置对象时,以为这些方法都太简单了,结果要自己实际操作写一个时钟效果还真一时把我难住了,主要有几点大家要注意的.先看实际效果 要实现这样的效果 某年某月某日星期几几 ...

  4. 史上最简单的js+css3实现时钟效果

    今天我看到百度搜索的时间那个效果不错,于是就产生了模仿一下的效果,不过为了节省时间,就随便布了下局,废话不多说,先看看效果吧,顺便把百度的效果也拿过来. 对比样子差了好多啊,但是基本功能都是实现了的, ...

  5. GDI绘制时钟效果，与系统时间保持同步，基于Winform

    2018年工作之余,想起来捡起GDI方面的技术,特意在RichCodeBox项目中做了两个示例程序,其中一个就是时钟效果,纯C#开发.这个CSharpQuartz是今天上午抽出一些时间,编写的,算是偷 ...

  6. 转 CSS3+js实现多彩炫酷旋转圆环时钟效果

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  7. canvas实现的时钟效果

    最近在网上看到了一个css3实现的可爱时钟,觉得很nice,然后就想着用canvas试试实现这个时钟效果. 首先,要实现时钟需要先计算时钟上的数字应该占整个圆的大小. 因为一个圆是360度,所以数字之 ...

  8. 基于canvas的原生JS时钟效果

    概述 运用html5新增画布canvas技术,绘制时钟效果,无需引用任何插件,纯js. 详细 代码下载:http://www.demodashi.com/demo/11935.html 给大家介绍一个 ...

  9. JS实现时钟效果

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

随机推荐

  1. oracle之报错:ORA-00054: 资源正忙，要求指定 NOWAIT

    oracle之报错:ORA-00054: 资源正忙,要求指定 NOWAIT 问题如下: SQL> conn scott/tiger@vm_database Connected to Oracle ...

  2. 准备使用 Office 365 中国版--邮箱迁移

    微软产品一贯的作风是从来不缺文档和教程,Office 365也不例外.无论是最终用户还是企业IT管理员,都可参照Office 365使用指南顺利的开启Office 365之旅.不过比较奇怪的是,貌似很 ...

  3. 突然发现这周有点忙。。着玩-PHP进阶

    hi 周二才,不过我突然意识到这周有点忙着玩的感觉,还是很期待的——今天下午去市里,晚上回来看电影,明晚聚餐吃火锅,后天下午拍短片,晚上可能要打球,周五,嗯,就到周五了.虽然这样下去连怎么写(bian ...

  4. stanford coursera 机器学习编程作业 exercise4--使用BP算法训练神经网络以识别阿拉伯数字(0-9)

    在这篇文章中,会实现一个BP(backpropagation)算法,并将之应用到手写的阿拉伯数字(0-9)的自动识别上. 训练数据集(training set)如下:一共有5000个训练实例(trai ...

  5. Object.Destroy慎用

    Object.Destory Destory(Object)并没有立刻,马上,及时的删除这个Object. 举例 在使用NGUI的Table或Grid进行布局时,就需要注意了:尽量不要使用Destro ...

  6. 菜鸟的IT生活4

    今天主要复习了以前的内容,输入输出,数据类型,运算符,顺序语句,分支语句等等,把几个不太连贯跟没上传过的传一下,以后加深下印象,加油!

  7. QuickFix/N简介

    QuickFix/N简介  FIX是Financial Information eXchange的简称.FIX是一种专门为实时电子证券交易设计的标准消息协议.该协议由FIX protocol, Ltd ...

  8. 转：windows下命令行工具

    转自: http://www.cnblogs.com/haochuang/p/5593411.html Windows下CMD不好用,远没有Linux,或者一些SSH工具用起来方便.其实Windows ...

  9. poj2531 Network Saboteur

    Network Saboteur Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 11122   Accepted: 5372 ...

  10. win7 远程桌面关机

    在任务管理器中, 打开运行窗口, 执行 shutdown -s 命令, 将在30秒后关闭win7, 如果需要更快, 加上 -t 10 参数 关于 shutdown 的命令行说明: C:\Users\R ...