目前,我在看这个入门教程视频的angular.js
在某一时刻(后12'40" ),扬声器指出的属性ng-app和data-ng-app=""是内部或多于或少于<html>标签等都是ng-model="my_data_binding和data-ng-model="my_data_binding"。但是发言者说,HTML代码将通过不同的验证验证,这取决于哪个属性用过的。
您能解释一下ng-前缀和data-ng-前缀这两种方式之间的区别吗?
目前,我在看这个入门教程视频的angular.js
在某一时刻(后12'40" ),扬声器指出的属性ng-app和data-ng-app=""是内部或多于或少于<html>标签等都是ng-model="my_data_binding和data-ng-model="my_data_binding"。但是发言者说,HTML代码将通过不同的验证验证,这取决于哪个属性用过的。
您能解释一下ng-前缀和data-ng-前缀这两种方式之间的区别吗?
Answers:
好问题。区别很简单-两者之间绝对没有区别,只是某些HTML5验证程序将对属性诸如抛出错误ng-app,但对于data-诸如前缀的任何内容都不会引发错误data-ng-app。
因此,要回答您的问题,请使用data-ng-app是否希望更轻松地验证HTML。
有趣的事实:您也可以使用x-ng-app达到相同的效果。
data-和似乎浪费了CPU周期x-。为什么不能将HTML验证规则更改为接受ng-内容?
data-*属性是扩展HTML的方法。
Angular对元素的标记和属性名称进行归一化,以确定哪些元素与哪些指令匹配。我们通常通过区分大小写的camelCase规范化名称(例如ngModel)来引用指令。但是,由于HTML不区分大小写,因此我们以小写形式引用DOM中的指令,通常在DOM元素(例如ng-model)上使用破折号分隔的属性。
规范化过程如下:
从元素/属性的前面去除x-和data-。将:,-或_分隔的名称转换为camelCase。以下是与ngBind匹配的元素的一些等效示例:
根据上述声明,以下所有有效指令
1. ng-bind
2. ng:bind
3. ng_bind
4. data-ng-bind
5. x-ng-bind
区别在于,自定义data-*属性在HTML5规范中有效。因此,如果您需要验证标记,则应使用它们而不是ng属性。
ng-model并data-ng-model相同!
原因: data-前缀
HTML5规范要求任何自定义属性都以作为前缀data-。
原因:这两个ng-model和data-ng-model相同和等同的。
AngularJS文档-规范化
Angular对元素的标签和属性名称进行规范化,以确定哪些元素与哪些指令匹配。我们通常通过区分大小写的camelCase规范化名称(例如ngModel)来引用指令。但是,由于HTML不区分大小写,因此我们以小写形式引用DOM中的指令,通常在DOM元素(例如)上使用破折号分隔的属性ng-model。
规范化过程如下:
1.剥离x-并data-从元素/属性的前面开始。
2.转换的:,-或_-delimited名camelCase。
例如
以下形式都是等效的,并且与ngBind指令匹配:
<div ng-controller="Controller">
Hello <input ng-model='name'> <hr/>
<span ng-bind="name"></span> <br/>
<span ng:bind="name"></span> <br/>
<span ng_bind="name"></span> <br/>
<span data-ng-bind="name"></span> <br/>
<span x-ng-bind="name"></span> <br/>
</div>