Question

ng-if和data-ng-if有什么区别？

它们似乎都以相同的方式工作，但是由于data-ng-if上没有太多可用的资料，因此我无法弄清它们的区别。

Answer 1

从技术上讲，两者是相同的，但是在验证页面W3C validator而不在自定义属性上定义data-时，它将失败，因为W3C validator对自定义属性一无所知，因此您必须在自定义属性之前明确定义data-，然后W3C validator会传递HTML

Answer 2

它们是等效的。 $compile服务将它们链接到同一指令。

从文档中：

标准化过程如下：


从元素/属性的前面剥离x-和data-。

将:，-或_分隔的名称转换为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>

有关更多信息，请参见

AngularJS Developer Guide - Directive Normalization

Answer 3

arbitary attribute HTML 5引入了data属性。使用数据前缀-我们可以创建自定义数据属性，例如 <div id="thediv" data-ng-if="conditino"></div>

Answer 4

两者实际上是相同的。
两者都是用于指定条件的指令。
您可以将ng-if或 ng-if 与data-或x-一起使用，例如 data-ng-if 或 x-ng-if < / strong>。

由于“ HTML5验证程序”，Angular允许在其指令之前添加data-或x-作为验证的前缀。

验证意味着您不会在Eclipse的“问题”选项卡中获得任何警告，也不会在使用的任何IDE（例如“ Eclipse中的未定义属性名称（ng-model）”）得到任何警告。

如果要使页面HTML的有效性仅此而已，可以使用data-ng-而不是ng-。

这两个术语之间的唯一区别是 data-ng-app或x-ng-app验证HTML，而ng-app无效。< / li>
功能保持不变。

ng-if和data-ng-if有什么区别

4 个答案: