码迷,mamicode.com
首页 > Web开发 > 详细

(四)Angularjs - 小实例(2)

时间:2015-03-13 12:25:37      阅读:153      评论:0      收藏:0      [点我收藏+]

标签:

自定义指令编写时钟

模板

<!-- 模板文件 -->
<html> <!-- 内置的ng-app指令通知编译器启动AngularJS框架--> <body ng-app="ezstuff"> <!-- 我们自己定义的ez-clock指令通知编译器生成时钟widget--> <ez-clock></ez-clock> </body> <script src="angular.js"></script> </html>

controller

 1 angular.module("ezstuff",[])//创建模块ezstuff
 2     .directive("ezClock",function(){//在模块上注册指令ezClock的类工厂
 3     return {
 4         restrict : "E",
 5         replace : true,
 6         template : "<div class=‘clock‘></div>",
 7         link : function(scope,element,attrs){
 8             setInterval(function(){
 9                 //获取当前时间
10                 var d = new Date();
11 
12                 //element对应引用该指令的DOM对象的jqLite封装
13                 element.text(d.toString());
14             },1000);
15         }
16     }
17 });

 

(四)Angularjs - 小实例(2)

标签:

原文地址:http://www.cnblogs.com/huair_12/p/4334551.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!