angularjs实现时钟效果
<!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实现时钟效果的更多相关文章
- Flash AS实现时钟效果(全脚本实现)
最近工作中用到个Flash效果,好久没有写FlashAS脚本了,就想从以前写的代码中找一些实例.竟然看到硬盘中还留有若干年前的代码. 这个时钟效果是全部采用脚本实现,图形也是用脚本绘制的.写于2005 ...
- transform实现的时钟效果
又来一个时钟效果了,这个的实现不需要canvas,都是div.ul.li画出的,好玩有真实. 哈哈~ 需要的js才能实现到走动这个效果,但js的内容不多,也不难. 主要是一个css里transform ...
- 原生javascript实现网页显示日期时钟效果
刚接触javascript中Date内置对象时,以为这些方法都太简单了,结果要自己实际操作写一个时钟效果还真一时把我难住了,主要有几点大家要注意的.先看实际效果 要实现这样的效果 某年某月某日星期几几 ...
- 史上最简单的js+css3实现时钟效果
今天我看到百度搜索的时间那个效果不错,于是就产生了模仿一下的效果,不过为了节省时间,就随便布了下局,废话不多说,先看看效果吧,顺便把百度的效果也拿过来. 对比样子差了好多啊,但是基本功能都是实现了的, ...
- GDI绘制时钟效果,与系统时间保持同步,基于Winform
2018年工作之余,想起来捡起GDI方面的技术,特意在RichCodeBox项目中做了两个示例程序,其中一个就是时钟效果,纯C#开发.这个CSharpQuartz是今天上午抽出一些时间,编写的,算是偷 ...
- 转 CSS3+js实现多彩炫酷旋转圆环时钟效果
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- canvas实现的时钟效果
最近在网上看到了一个css3实现的可爱时钟,觉得很nice,然后就想着用canvas试试实现这个时钟效果. 首先,要实现时钟需要先计算时钟上的数字应该占整个圆的大小. 因为一个圆是360度,所以数字之 ...
- 基于canvas的原生JS时钟效果
概述 运用html5新增画布canvas技术,绘制时钟效果,无需引用任何插件,纯js. 详细 代码下载:http://www.demodashi.com/demo/11935.html 给大家介绍一个 ...
- JS实现时钟效果
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
随机推荐
- Puppet3在CentOS6.5集群下的安装
环境:3台主机, IP分别为10.211.55.11.12.13 puppet master安装在10.211.55.11 puppet agent安装在10.211.55.11.12.13 1.安装 ...
- Medusa引擎开源了
首先贴出 Github地址 然后博客地址 相比于市面上其他的著名游戏引擎,例如Unity,cocos2dx,Unreal,Medusa游戏引擎目前还非常的简陋,目前实现的功能还集中在2D部分,3D的虽 ...
- UVALive 5000 Underwater Snipers --二分
题意:一条河岸线y=k,y>k区域有n个敌人,现在要在y<=k区域布置S个狙击手,狙击手的狙击范围为距离自己半径为D的圆内,问满足能够狙死所有的敌人的情况下,离河岸线最近的那个狙击手的离河 ...
- POJ 2540 Hotter Colder --半平面交
题意: 一个(0,0)到(10,10)的矩形,目标点不定,从(0,0)开始走,如果走到新一点是"Hotter",那么意思是离目标点近了,如果是"Colder“,那么就是远 ...
- VS使用Sublime Text 主题
VS主题需求 VS默认有三种主题Dark,Light,Blue,但你是否想寻找其它的主题呢?本文介绍两种方法来满足你的不同需求 1.微软官方扩展 微软官方推出的 Visaul Studio Color ...
- JavaWeb学习总结,文件上传和下载
在Web应用系统开发中,文件上传和下载功能是非常常用的功能,今天来讲一下JavaWeb中的文件上传和下载功能的实现. 对于文件上传,浏览器在上传的过程中是将文件以流的形式提交到服务器端的,如果直接使用 ...
- [No00003F]richtextbox实现拖放
namespace WindowsFormsApplication1 { public partial class Form1 : Form { public Form1() { Initialize ...
- 转: rapidJSON与jsoncpp语法说明
转: http://www.voidcn.com/blog/hudejun007/article/p-1811986.html
- poj1273 Drainage Ditches
Drainage Ditches Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 68414 Accepted: 2648 ...
- rstudio安装devtool出现“无法解析服务器的名称或地址”问题的解决
问题:直接使用CRAN的源出现如下错误 Warning in install.packages : InternetOpenUrl failed: '无法解析服务器的名称或地址'Warning in ...