(学习笔记)angular自定义指令

angularjs有两种创建自定义指令的方式:

1.module.directive(name,directiveFactory)

2.@see $compileProvider.directive()

var app=angular.module('myApp',[],function($compileProvider){$compileProvider.directive('nameName',function(){//请不要使用ng为指令命名,这样可能会和angular内置指令冲突//如果指令的名字为xxx-yyy,在设置指令的名字时应为xxxYyy驼峰式声明法return{/**自定义指令选项**/};});});

指令定义选项:
priority
terminal
scope
controller
controllerAs
require
restrict
template
templateUrl
replace
transclude
compile
link

自定义选项详解:

restrict:如果忽略restrict,默认为A
如果打算支持ie8,请使用基于属性和样式的指令
E元素
C样式
A属性
M注释
template
template:定义模板内容,这个内容会根据replace参数设置节点或替换节点内容.
例:template:'123'
replace:如果此配置为true则替换指令所在的元素,如果为false或者不指定,则把当前指令追加到所在元素内部
注意:最好设置replace属性为true,因为自定义标签在某些情况下不识别,即自定义的标签不符合H5规范
对于restrict为元素(E)在最终效果中多余的,所有replace通常设置为true

transclude
将将要被替换的标签内容加在替换后的标签内容之后
例:

template:'替换数据 

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！