这篇文章主要介绍了AngularJS优雅的自定义指令,告诉大家为什么使用AngularJS自定义指令,以及如何使用AngularJS自定义指令?感兴趣的小伙伴们可以参考一下
学习要点
  •为什么使用指令
  •创建自定义指令 
 •使用jqLite工作 
一、为什么使用自定义指令 
NG内置了许多自定义指令,但是它们有时并不能满足你的要求,这是需要我们创建自定义属性。 
二、自定义指令 
接下来,我们来做一个小案例,当鼠标单击加价后,列表项自动递增,当然列表也是通过指令自动添加的,它本就是一个空的div
Angluar test Products
解析: 
 第一步:创建控制器,添加数据模型products和递增价格incrementPrices()方法 
 第二步:自定义unorderlist标签,该标签的作用是:通过作用域数据模型的值,将其值以无序列表的方式展示出来 
 第三部:并且在单击加价按钮时,无序列表的值会依次递增

三、使用jqLite工作 
NG内置了jqLite,它是JQuery的缩小版
Angluar test 
- Apples
 
- Bananas
 - Cherries
 - Oranges
 - Pears
 - Oranges
 
解析: 
第一步:自定义控制器,定义数据模型names 
 第二步:自定义指令,功能是将使用指令的元素下的所有li找出,并且更加值的不同赋给字体不同的颜色 
 第三步:在视图中调用并且使用指令 

以上就是AngularJS优雅的自定义指令的详细内容,更多请关注易知道|edz.cc其它相关文章!














