Разница между 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 нормализует тег элемента и имя атрибута, чтобы определить, какие элементы соответствуют каким директивам... Процесс нормализации выглядит следующим образом:

  1. полоса x- а также data- от передней части элемента / атрибутов.
  2. Преобразовать :, -, или же _-ограниченное имя для 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:

(это помогло мне понять ответ Сильвестра, поэтому я подумал, что это может помочь и другим.)

Другие вопросы по тегам