tempalte表示,将替换指令里面的内容,生成一个新的模板。例如:
1 <body> 2 <student></student><br/> 3 <span student></span><br/> 4 <span class="student"></span><br/> 5 <!-- directive:student --> 6 </body> 7 <script src="../lib/angular/angular.js"></script> 8 <script> 9 angular.module('zfpxMod',[]); 10 angular.module('zfpxMod').directive('student',function(){ 11 return { 12 // A Attribute 属性 E element 元素 M Commnent注释 C class 类名 13 restrict:'AEMC',//限定指令出现的位置AEMC 14 replace:true,// 会把指令本身替换掉 15 template:'<div>name:zf</div>' 16 } 17 }); 18 </script>
结果就是:
<div>name:zf</div><br>
<div student="">name:zf</div><br>
<div class="student">name:zf</div><br>
<div student="">name:zf</div>
说明template替换了原来页面的内容,至于哪些元素容许替换,接下来我们就看
restrict,
restrict 的取值可以有三种:
- A 用于元素的 Attribute,这是默认值
- E 用于元素的名称
- C 用于 CSS 中的 class
至于页面容不容许被替换就要看
replace是为ture还是false