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

angularjs指令系统系列课程(2):priority,template,templateUrl

时间:2016-04-29 14:07:47      阅读:128      评论:0      收藏:0      [点我收藏+]

标签:

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

 

angularjs指令系统系列课程(2):priority,template,templateUrl

标签:

原文地址:http://www.cnblogs.com/qiumohanyu/p/5445716.html

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