Html AngularJS 标签属性

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/12107504/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 02:27:26  来源:igfitidea点击:

AngularJS tags attributes

htmlangularjs

提问by Sergei Basharov

I am learning about AngularJS and see it adds some of its own attributes that nor start with data neither are standard html tags attributes, like this:

我正在学习 AngularJS 并看到它添加了一些自己的属性,这些属性也不是以数据开头,也不是标准的 html 标签属性,如下所示:

<html ng-app>

or this:

或这个:

<body ng-controller="PhoneListCtrl">

Where from do these ng-* attributes come and is that a valid HTML? Where can I read more about this?

这些 ng-* 属性是从哪里来的,它是一个有效的 HTML 吗?我在哪里可以阅读更多相关信息?

采纳答案by Alexander R

Strictly speaking these extra attributes are not defined in the HTML specifications thus, are not valid HTML. You could say that AngularJS provides and parses a superset of the HTML specification.

严格地说,这些额外的属性没有在 HTML 规范中定义,因此不是有效的 HTML。你可以说 AngularJS 提供并解析了 HTML 规范的超集。

However, as of v1.0.0rc1, you could use data-* attributes, for example <html data-ng-app>which, I believe, are valid HTML5. Source.

但是,从 v1.0.0rc1 开始,您可以使用 data-* 属性,例如<html data-ng-app>,我认为这些属性是有效的 HTML5。来源

There is a guide to the AngularJS Compilerthat contains some more information on the process. In short; the AngularJS compiler reads your HTML page, using these attributes to guide it as it edits and updates your page, after loading, via javascript and the HTML DOM.

有一个AngularJS 编译器指南,其中包含有关该过程的更多信息。简而言之; AngularJS 编译器读取您的 HTML 页面,使用这些属性来指导它在加载后通过 javascript 和 HTML DOM 编辑和更新您的页面。

回答by GFoley83

From the docs: http://docs.angularjs.org/guide/directive

来自文档:http: //docs.angularjs.org/guide/directive

<!doctype html>
<html data-ng-app>
  <head>
    <script src="http://code.angularjs.org/1.0.7/angular.min.js"></script>
    <script src="script.js"></script>
  </head>
  <body>
    <div data-ng-controller="Ctrl1">
      These are all valid directive declarations:<br/>
      <input ng-model='name'> <hr/>
      <span ng:bind="name"></span> <br/>
      <span ng_bind="name"></span> <br/>
      <span ng-bind="name"></span> <br/>          
      <span x-ng-bind="name"></span> <br/>
      <span data-ng-bind="name"></span> <br/>
    </div>
  </body>
</html>

I like the data-*whatever*declaration the best as it's HTML5 compliant.

我最喜欢这个data-*whatever*声明,因为它符合 HTML5。

So for any of my Angular declaration (e.g. ng-controller, ng-app, ng-repeatetc) or custom directives I'll always prefix them with data-.

因此,对于我的任何角度声明(例如ng-controllerng-appng-repeat等)或自定义指令和我永远前缀他们data-

回答by Artem Andreev

Where from do these ng-* attributes come

这些 ng-* 属性从何而来

From main ng module. Source code.

从主ng 模块源代码

is that a valid HTML?

这是一个有效的 HTML 吗?

No. But attribute-style directives can be prefixed with x-, or data- to make it HTML validator compliant. See direcives documentation.

不可以。但是属性样式指令可以以 x- 或 data- 为前缀,以使其符合 HTML 验证器。请参阅指令文档

回答by Andrew Salido

Another option is to ignore undefined attribute names. If you are using Eclipse, you can set this by going to project properties>>validation>>html syntax>>attributes>>ignore undefined attribute names.

另一种选择是忽略未定义的属性名称。如果您使用的是 Eclipse,则可以通过转到 project 来进行设置properties>>validation>>html syntax>>attributes>>ignore undefined attribute names