Разница между ng-моделью и data-ng-моделью
Я новичок в AngularJs. Кто-нибудь может сказать разницу между ng-моделью и data-ng-моделью?
С нг-моделью
First Name : <input type="text" ng-model="fname" id="fname">
Second Name : <input type="text" ng-model="lname" id="lname">
С моделью данных
First Name : <input type="text" data-ng-model="fname" id="fname">
Second Name : <input type="text" data-ng-model="lname" id="lname">
6 ответов
Рекомендация: предпочитайте использовать формат с разделителями-тире (например, ng-bind для ngBind). Если вы хотите использовать инструмент проверки HTML, вы можете вместо этого использовать версию с префиксом данных (например, data-ng-bind для ngBind). Другие формы, показанные выше, принимаются по наследству, но мы советуем вам их избегать.
В то время как оба ng-model
а также data-ng-model
будет работать, HTML5 ожидает, что любой пользовательский атрибут будет иметь префикс data-
,
<!-- not HTML5 valid -->
<input type="text" ng-model="name">
<!-- HTML5 valid -->
<input type="text" data-ng-model="name">
Они одинаковые. Угловые полосы data-
часть из атрибута. Из документов:
Angular нормализует тег элемента и имя атрибута, чтобы определить, какие элементы соответствуют каким директивам... Процесс нормализации выглядит следующим образом:
- полоса
x-
а такжеdata-
от передней части элемента / атрибутов.- Преобразовать
:
,-
, или же_
-ограниченное имя дляcamelCase
,
Там нет никакой разницы между ng-model
а также data-ng-model
если вы видите с точки зрения AngularJs.
На самом деле, "данные" используются в качестве префикса для проверки правильности HTML5. Таким образом, это хорошая практика для использования data-ng-model
Тем не менее, вы можете использовать ng-model
также. В этом тоже нет проблем.
Оба имеют одинаковое значение и оба имеют одинаковый результат:
С нг-моделью
First Name : <input type="text" ng-model="fname" id="fname">
Second Name : <input type="text" ng-model="lname" id="lname">
С моделью данных
First Name : <input type="text" data-ng-model="fname" id="fname">
Second Name : <input type="text" data-ng-model="lname" id="lname">
Ответ sylewester правильный, и его можно прочитать в документации по директиве AngularJS, которую можно найти по адресу https://docs.angularjs.org/guide/directive .
(это помогло мне понять ответ Сильвестра, поэтому я подумал, что это может помочь и другим.)
ответ sylewester правильный, и его можно прочитать в документации по директиве AngularJS, которую можно найти по адресу https://docs.angularjs.org/guide/directive . Ниже приведен отрывок с этой страницы.
AngularJS нормализует имя тега и атрибута элемента, чтобы определить, какие элементы соответствуют каким директивам. Обычно мы обращаемся к директивам по их нормализованному имени в camelCase с учетом регистра (например, ngModel). Однако, поскольку HTML нечувствителен к регистру, мы обращаемся к директивам в DOM строчными буквами, обычно используя атрибуты, разделенные тире, в элементах DOM (например, ng-model).
Процесс нормализации выглядит следующим образом:
Удалите x- и data- с передней части элемента/атрибутов. Преобразуйте имя с разделителями :, - или _ в camelCase.
Например, все следующие формы эквивалентны и соответствуют директиве ngBind:
(это помогло мне понять ответ Сильвестра, поэтому я подумал, что это может помочь и другим.)