angular学习笔记(三十)-指令(1)-概述
之前在 angular学习笔记(十九)-指令修改dom 里面已经简单的提到了angular中的指令,现在来详细的介绍 '指令'
一.指令的创建:
dirAppModule.directive('directive-name',function(){
var obj = {
restrict:'string',
priority:number,
template:'string',
templateUrl:'string',
replace:bool,
transclude:bool or 'element',
scope:bool or string,
controller:function(){},
require:'string',
link: function(scope,element,attrs,ctrl,transclude){},
compile: function(element,attrs,transclude){
return {
pre: function(scope,element,attrs,controller){},
post: function(scope,element,attrs,controller){}
}
}
};
return obj
});
通过 app.directive('directive-name',function(){})来创建一个服务. directive()方法传入两个参数.
第一个参数:是一个字符串,也就是指令的名字.一般的命名规则是用'-'来分割,'-'前是命名空间,'-'后是给这个指令取的名字.其实我们之前用到的比如'ng-repeat','ng-model','ng-view'...等,这些都是angular自带的指令.他们的实质也就是指令.所以,自己创建的指令不应该使用ng作为命名空间.
第二个参数:是一个函数,该函数返回一个json对象.该对象一共可以有上面列出来的11个属性.在后面的文章中一一讲解这些属性.
angular学习笔记(三十)-指令(1)-概述的更多相关文章
- angular学习笔记(三十)-指令(10)-require和controller
本篇介绍指令的最后两个属性,require和controller 当一个指令需要和父元素指令进行通信的时候,它们就会用到这两个属性,什么意思还是要看栗子: html: <outer‐direct ...
- angular学习笔记(三十)-指令(7)-compile和link(2)
继续上一篇:angular学习笔记(三十)-指令(7)-compile和link(1) 上一篇讲了compile函数的基本概念,接下来详细讲解compile和link的执行顺序. 看一段三个指令嵌套的 ...
- angular学习笔记(三十)-指令(7)-compile和link(1)
这篇主要讲解指令中的compile,以及它和link的微妙的关系. link函数在之前已经讲过了,而compile函数,它和link函数是不能共存的,如果定义了compile属性又定义link属性,那 ...
- angular学习笔记(三十)-指令(6)-transclude()方法(又称linker()方法)-模拟ng-repeat指令
在angular学习笔记(三十)-指令(4)-transclude文章的末尾提到了,如果在指令中需要反复使用被嵌套的那一坨,需要使用transclude()方法. 在angular学习笔记(三十)-指 ...
- angular学习笔记(三十)-指令(5)-link
这篇主要介绍angular指令中的link属性: link:function(scope,iEle,iAttrs,ctrl,linker){ .... } link属性值为一个函数,这个函数有五个参数 ...
- angular学习笔记(三十)-指令(2)-restrice,replace,template
本篇主要讲解指令中的 restrict属性, replace属性, template属性 这三个属性 一. restrict: 字符串.定义指令在视图中的使用方式,一共有四种使用方式: 1. 元素: ...
- angular学习笔记(三十)-指令(8)-scope
本篇讲解指令的scope属性: scope属性值可以有三种: 一.scope:false 默认值,这种情况下,指令的作用域就是指令元素当前所在的作用域. 二.scope:true 创建一个继承了父作用 ...
- angular学习笔记(三十)-指令(7)-compile和link(3)
本篇接着上一篇来讲解当指令中带有template(templateUrl)时,compile和link的执行顺序: 把上一个例子的代码再进行一些修改: 1.将level-two指令改成具有templa ...
- angular学习笔记(三十)-指令(4)-transclude
本篇主要介绍指令的transclude属性: transclude的值有三个: 1.transclude:false(默认值) 不启用transclude功能. 2.transclude:true 启 ...
随机推荐
- Ubuntu x86-64汇编(6)
寻址方式 Addressing Modes 地址和值 Addresses vs Values 在64bit架构中, 地址是64bit. 访问内存内容的唯一方式就是通过方括号, 不加方括号读取的只是地址 ...
- 阿里云ecs配置辅助网卡绑定公网ip地址
EIP直通车 前置条件:1.大家的实例是从经典迁移到VPC里面的,上古时期,经典实例大家购买实例的时候都是买了带宽的.而这种带宽一般情况下都是包年包月的,而且这种绑定在实例上的IP,我们把它叫做公网I ...
- HTTP 接口响应数据解析
转自:https://blog.csdn.net/hubanbei2010/article/details/79878567 作为产品线的支撑角色QA/CI/CD等,http api解析是互联网公司中 ...
- keras中的loss、optimizer、metrics
用keras搭好模型架构之后的下一步,就是执行编译操作.在编译时,经常需要指定三个参数 loss optimizer metrics 这三个参数有两类选择: 使用字符串 使用标识符,如keras.lo ...
- [转]awesome-tensorflow-chinese
模型项目 Domain Transfer Network - Implementation of Unsupervised Cross-Domain Image Generation Show, At ...
- Android开发环境——连接驱动ADB相关内容汇总
Android开发环境将分为SDK相关内容.Eclipse ADT相关内容.模拟器AVD相关内容.调试器DDMS相关内容.日志LogCat相关内容.连接驱动ADB相关内容.内存泄露检测工具MAT相关 ...
- IT公司管理发展经验
2012-11-14 内容存档在evernote,笔记名"IT公司管理发展经验"
- 颜色传感器TCS230及颜色识别电路(转)
摘要 TCS230是美国TAOS公司生产的一种可编程彩色光到频率的传感器.该传感器具有分辨率高.可编程的颜色选择与输出定标.单电源供电等特点:输出为数字量,可直接与微处理器连接.文中主要介绍TCS23 ...
- 【js】在js中加HTML注释标签的原因?
<script type="text/JavaScript"> <!-- js代码 //--> //就是这句,为什么还要在-->前加上js注释 < ...
- JAVA环境变量的脚本
简单的一个脚本,用于自动设置环境变量.把代码拷贝,另存为javaEnv.bat.安装完Java 2 SDK之后,开一个命令行窗口,输入javaEnv java2SDKDir(java2SDKDir是你 ...