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的链接 或者一个返回链接的函数
angularjs指令系统系列课程(2):优先级priority,模板template,模板页templateUrl的更多相关文章
- angularjs指令系统系列课程(1):目录
angularjs里面有一套十分强大的指令系统 比如内置指令:ng-app,ng-model,ng-repeat,ng-init,ng-bind等等 从现在开始我们讲解AngularJS自定义指令, ...
- angularjs指令系统系列课程(5):控制器controller
这一节我们来说一下controller这个参数 一.指令控制器的配置方法: 对于指令我有两种配置路由的方式:1.在html中直接引用,2,在指令的controller参数里定义 第一种:在html中直 ...
- angularjs指令系统系列课程(4):作用域Scope
指令的scope对象是一个很重要,很复杂的对象,我们这一节作为重点讲解 可取值: 1.false(默认), 2.true, 3.{}(object) 1.false:默认值,不创建新的作用域 2.tr ...
- angularjs指令系统系列课程(3):替换replace,内容保留transclude,作用方式restrict
这一节我们主要看一下replace,transclude,restrict这三个参数 1.replace 可取值:bool 默认为:true 对于replace属性,设置为false表示原有指令标识不 ...
- django template 模板
九.Template模板 Template 模板是根据view传过来数据在html展示的功能,典型python 模板jinjia2库提供丰富的上下文展示func 创建template位置在项目下与ap ...
- [js高手之路]设计模式系列课程-组合模式+寄生组合继承实战新闻列表
所谓组合模式,就是把一堆结构分解出来,组成在一起,现实中很多这样的例子,如: 1.肯德基套餐就是一种组合模式, 比如鸡腿堡套餐,一般是是由一个鸡腿堡,一包薯条,一杯可乐等组成的 2.组装的台式机同理, ...
- AngularJS路由系列(6)-- UI-Router的嵌套State
本系列探寻AngularJS的路由机制,在WebStorm下开发.本篇主要涉及UI-Route的嵌套State. 假设一个主视图上有两个部分视图,部分视图1和部分视图2,主视图对应着一个state,两 ...
- Silverlight for Windows Phone开发系列课程
Silverlight for Windows Phone开发系列课程(1):Windows Phone平台概况 课程简介:本节开始介绍系列课程的概况,包括课程内容,先决条件,学习目的 ...
- Elasticsearch顶尖高手系列课程推荐
Elasticsearch,是目前行业中非常热门的一个技术.Elasticsearch是一种分布式的海量数据搜索与分析的技术,可以用于电商网站.门户网站.企业IT系统等各种场景下的搜索引擎,也可以用于 ...
随机推荐
- 如何用jenkins实现自动化构建新版本和二维码下载
最近公司开发了自己的app,研发过程中对于测试人员来说,经常会像开发的人员询问,有没有最新的包啊(apk打包后的新版本),以免你测试的时候,提交了一些缺陷,实际上人家已经解决了.当然你也可以说你们公司 ...
- freemarker配置信息
<!-- <!– freemarker的配置 –> <bean id="freemarkerConfigurer" class="org.spr ...
- Android--自定义加载框
1,在网上看了下好看的加载框,看了一下,挺好看的,再看了下源码,就是纯paint画出来的,再加上属性动画就搞定了 再来看一下我们的源码 LvGhost.java package com.qianmo. ...
- 3.MongoDB下Windows下的安装
由于博主目前使用的是Windows的系统,没有使用Linux等其它的系统,因此此安装配置和开发使用,均是在Windows下进行的,以后在使用其它的系统的时候,再将其它系统的配置的使用补充上来. 1.下 ...
- maven官方库中没有oracle jdbc驱动的问题解决
1.找到可用的oracle jdbs驱动jar包文件,放置到指定目录(可根据实际自定义) D:\jdbc\ojdbc14.jar 2.安装好maven,主要是配置好环境变量 MAVEN_HOME='指 ...
- MyBatis学习教程
http://www.yihaomen.com/article/java/302.htm http://www.yihaomen.com/article/java/303.htm http://www ...
- JQuery常用方法一览
$(”p”).addClass(css中定义的样式类型); 给某个元素添加样式 $(”img”).attr({src:”test.jpg”,alt:”test Image”}); 给某个元素添加属性/ ...
- ResultSet相关ResultSetMetaData详细
DatabaseMetaData 有关整个数据库的信息:表名.表的索引.数据库产品的名称和版本.数据库支持的操作. ResultSet 关于某个表的信息或一个查询的结果.您必须逐行访问数据行,但是您可 ...
- android微信支付总结+自己搭建服务器
1.前期注册操作 1-1:微信开发平台:https://open.weixin.qq.com/ 1-2:创建移动应用 签名获取: 1.将自己的apk签名打包,运行到手机上. 2.将微信支付的签名工具, ...
- asp之缓存 cachestate
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.We ...