angularjs指令系统系列课程（2）：优先级priority,模板template,模板页templateUrl

今天我们先对 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的链接 或者一个返回链接的函数