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

Angularjs_directive_Demo

时间:2015-08-01 23:31:20      阅读:145      评论:0      收藏:0      [点我收藏+]

标签:

技术分享

 

 

1.文件列表

技术分享

 

2.dTest01.html

 1 <!doctype html>
 2 <html ng-app="mymy">
 3   <head>
 4       <meta  charset="UTF-8" >
 5       <script src="angular.js"></script>
 6       <script src="dTest01.js"></script>      
 7   </head>
 8   
 9   
10 <body>     
11    <div hello    ></div>
12    <hello></hello>
13    
14    <xxh></xxh>
15    <div  xxh></div>
16 </body>
17 
18 
19 </html>

 

3.dTest01.js

 1 angular.module( "mymy", [] )
 2 
 3     .run(function($templateCache){
 4         $templateCache.put(‘hello.html‘,‘<div>hello everyOne!!</div>‘);
 5     })
 6 
 7 
 8     .directive( "hello" , function($templateCache){
 9       
10       return {
11           restrict: ‘AE‘,
12           template: $templateCache.get(‘hello.html‘),
13           replace: true
14           
15       }
16       
17       
18     })
19     
20     .directive( "xxh" , function($templateCache){
21       
22       return {
23           restrict: ‘AE‘,
24           template: $templateCache.get(‘hello.html‘),
25           replace: true
26           
27       }
28       
29       
30     })

4.hello.html

1 <h1>wahaha</h1>

 

 

 

PS:今天被谷歌浏览器坑了,调用templateUrl命令的时候,谷歌浏览器加载报错。火狐浏览器却能正常运行。

Angularjs_directive_Demo

标签:

原文地址:http://www.cnblogs.com/maduar/p/4694850.html

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