Атрибуты тегов AngularJS

Я изучаю AngularJS и вижу, что он добавляет некоторые из его собственных атрибутов, которые не начинаются с данных, и не являются стандартными атрибутами html-тегов, например:

<html ng-app>

или это:

<body ng-controller="PhoneListCtrl">

Откуда берутся эти атрибуты ng- * и является ли это допустимым HTML? Где я могу узнать больше об этом?

Ответ 1

Строго говоря, эти дополнительные атрибуты не определены в спецификациях HTML, поэтому недействительны HTML. Вы можете сказать, что AngularJS предоставляет и анализирует надмножество спецификации HTML.

Однако с v1.0.0rc1 вы можете использовать атрибуты data- *, например <html data-ng-app>, которые, я считаю, являются действительными HTML5. Источник.

Существует руководство по AngularJS Compiler, в котором содержится дополнительная информация об этом процессе. Вкратце; компилятор AngularJS читает вашу HTML-страницу, используя эти атрибуты, чтобы направлять ее по мере ее редактирования и обновления вашей страницы после загрузки через javascript и HTML DOM.

Ответ 2

Из документов: 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>

Мне нравится объявление data-*whatever* лучше всего, так как оно соответствует HTML5.

Итак, для любого моего объявления Angular (например, ng-controller, ng-app, ng-repeat и т.д.) или настраиваемых директив я всегда буду префикс их data-.

Ответ 3

Откуда берутся эти атрибуты ng- *

Из основного ng module. Исходный код.

- это допустимый HTML?

Нет. Но директивы атрибутного стиля могут иметь префикс x- или data-, чтобы сделать его совместимым с HTML-валидатором. См. директив документации.

Ответ 4

Другой вариант - игнорировать имена атрибутов undefined. Если вы используете Eclipse, вы можете установить это, выбрав проект properties>>validation>>html syntax>>attributes>>ignore undefined attribute names.