今天我们先对 priority,template,templateUrl进行学习
1.priority
可取值:int
作用:优先级
一般priority默认为0,数值越大,优先级越高。当一个dom元素上有多个指令,在执行compile函数的时候,指令的执行顺序为:高优先级,先链接排序的先执行
如果想让一个指令最后一个执行:
terminal 这个参数设置为true,即可使该指令在同一个Dom元素上的指令列表里最后一个执行
2.template
可取值:string或function
作用:指令操作元素的内容
例如:
js
angular.module('app',[]) .directive('helloDirective',function(){
return{
template:'<div>hello Directive</div>'
}
});
或者
angular.module('app',{})
.directive('helloDirective', function() {
return {
template: function() {
return '<div>hello Directive</div>';
}
}
});
html:
<section ng-app>
<div id="hellodiv" hello-directive></div>
</section>
这样目标div,也就是指令作用的div 就会被填充template模板里面的内容
运行后html代码生成为:
<section class="ng-scope">
<div hello-directive="">
<div>hello Directive</div>
</div>
</section>
3.templateUrl
可取值:string或function
作用:指令操作元素的内容
该参数的功能和template一样,只是该参数的值为一个模板html的链接 或者一个返回链接的函数