欢迎来到山村网

Angular.JS中指令的命名规则

2019-03-09 12:23:50浏览:454 来源:山村网   
核心摘要:命名规范同一个AngularJS指令,在js文件和html文件中有着不同的命名规范:在js文件中使用标准的小驼峰命名法,在html文件中使用

命名规范

同一个AngularJS指令,在js文件和html文件中有着不同的命名规范:在js文件中使用标准的小驼峰命名法,在html文件中使用“小写字母+连接符”的命名法。如下表所示

在js文件中 在html文件中 ngApp ng-app myDirective my-directive

处理机制

AngularJS之所以选择这样的命名方式,是因为html文件不区分大小写,而js文件则对大小写敏感(myDir和mydir在js文件中是不同的指令,但html看来是同一个指令),为了避免可能出现的错误,所以使用上述命名规范。

AngularJS执行过程中,对“小写字母+连接符”形式的命名做如下处理,最终装换成小驼峰命名法:

去掉开始部分的x-和data-; 第一个单词不变,把连接符后面的单词首字母转换成大写,去掉连接符。

这里有两点需要注意:

指令命名时不要以x或data作为第一个单词 支持的链接符包括:,-和_,但通常会选择-作为连接符

隔离作用域对象中的属性命名

指令隔离作用域对象中属性命名规则同上,见下面代码:

.directive('myDirective', function() { return { restrict: 'A', scope: {  myUrl: '@', // 隔离作用域对象中属性命名为小驼峰命名法  mylinkText: '@' }, template: '<a href="{{myUrl}}">{{mylinkText}}</a>'})
<div my-directive  my-url="http://google.com" <!-- html文件中使用“小写字母+分割符”的命名方式-->  my-link-text="Click me"></div>
(责任编辑:豆豆)
下一篇:

Ubuntu电脑操作基础:新建文件夹

上一篇:

路由器都有哪些功能你不知道?

  • 信息二维码

    手机看新闻

  • 分享到
打赏
免责声明
• 
本文仅代表作者个人观点,本站未对其内容进行核实,请读者仅做参考,如若文中涉及有违公德、触犯法律的内容,一经发现,立即删除,作者需自行承担相应责任。涉及到版权或其他问题,请及时联系我们 xfptx@outlook.com