转自:https://www.cnblogs.com/best/tag/Angular/
内置的指令就算再丰富也是有限的,对于特殊的需要可以选择自定义指令,自定义指令可以封装常用操作也便于分享与交流,自定义指令的语法格式如下:
module.directive('指令名称',function(){
return { template:插入指令元素的模板 restrict:允许指令应用的范围 replace:告诉编译器用指令模板取代定义该指令的元素 transclude:是否可以访问内部作用域以外的作用域 scope:指定内部作用域 link:链接函数 controller:定义控制器来管理指令作用域和视图 require:指定所需要的其它指令 };});restrict:限制指令行为,允许指令应用的范围,取值,可以组合,如AE。
@:使用@(@attribute)来进行单向文本(字符串)绑定
= :使用=(=attribute)进行双向绑定变量& :使用&来调用父作用域中的函数3.5.1、第一个自定义指令
示例代码:
1 2 3 4 5 6 719 20 21 39 40 41指令 8 9 10 11 12
运行结果:
因为使用了replace属性,所以div标签被替换了,另外restrict指定为AE则标签可以作为元素与属性使用。
3.5.2、自定义时钟
上个自定义指定很简单,我将上一个指令修改为可以动态变化的时间及可以给时钟指定参数与事件。
示例代码:
指令
运行结果: