Angular form

Anonymous (anonymous@undisclosed.example.com) — 2016-01-09T14:29:43+00:00

Angular form

Проверка форм

Проверка форм осуществляет несколько действий, от проверки изменений Модели и сверки их с существующими правилами связки, до изменения DOM для обратной связи с пользователем.

Для создания такой формы необходимо задать ей имя, определяющее область видимости формы.

<form name="myForm"></form>

Angular распознает такую форму и будет проверять и отслеживать ввод пользователя, например, заполнил ли тот обязательные поля формы, и т.п.

Angular атрибцты

$pristine

После первоначального создания страницы Angular добавляет к форме свойство $pristine – это означает, что пользователь к ней ещё не притрагивался. Angular добавит класс ng-pristine к тем элементам, которые ещё не менялись.

$dirty

Противоположность pristine – это элементы, которые пользователь изменил. К ним добавляются классы ng-dirty, а классы ng-pristine удаляются. Форма не может вернуться к состоянию $pristine без перезагрузки страницы.

$valid

Каждое поле ввода может быть объявлено $valid. Например, если у поля есть атрибут ng-required, а пользователь заполнил его, то ему присваивается класс ng-valid

$invalid

Противоположность valid. По умолчанию, все формы находятся в состоянии $invalid – им присвоен класс ng-invalid. Переходы между этими двумя состояниями происходят по мере того, как пользователь вводит информацию.

Проверка на основе модели

В некоторых случаях нужно отключать или включать поля ввода или кнопки – например, пока пользователь что-то не введёт. Простой пример переключения состояний кнопки, основанный на данных Модели. Если пользователь не ввёл имя, форму нельзя обновлять.

<input type="text" ng-model="user.name" placeholder="Введите имя">
<button ng-disabled="!user.name.length">
  Обновить имя
</button>

Библиотека знаний - java-script:angularjs:lessons

Angular form

Angular form

Проверка форм

Angular атрибцты

$pristine

$dirty

$valid

$invalid

Проверка на основе модели