Как я могу условно потребовать ввода формы с помощью AngularJS?

Предположим, что мы создаем приложение адресной книги (надуманный пример) с помощью AngularJS.

У нас есть форма для контактов, у которых есть входные данные для электронной почты и номера телефона, и мы хотим потребовать один или другой, но не оба. Мы хотим, чтобы email, если вход phone пуст или недействителен, и наоборот.

Angular имеет директиву required, но из документа не ясно, как использовать его в этом случае. Итак, как мы можем условно потребовать поле формы? Напишите пользовательскую директиву?

Ответы

Ответ 1

Нет необходимости писать настраиваемую директиву. Документация Angular хороша, но не завершена. Фактически, существует директива ngRequired, которая принимает выражение Angular.

<input type='email'
       name='email'
       ng-model='contact.email' 
       placeholder='[email protected]'
       ng-required='!contact.phone' />

<input type='text'
       ng-model='contact.phone'             
       placeholder='(xxx) xxx-xxxx'
       ng-required='!contact.email' />

Вот более полный пример: http://jsfiddle.net/uptnx/1/

Ответ 2

если вы хотите поместить требуемый ввод, если записывается другое:

   <input type='text'
   name='name'
   ng-model='person.name'/>

   <input type='text'
   ng-model='person.lastname'             
   ng-required='person.name' />

С уважением.

Ответ 3

Просто вы можете использовать проверку angular, например:

 <input type='text'
   name='name'
   ng-model='person.name'
   ng-required='!person.lastname'/>

   <input type='text'
   name='lastname'
   ng-model='person.lastname'             
   ng-required='!person.name' />

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

Ответ 4

Для Angular2

<input type='email' 
    [(ngModel)]='contact.email'
    [required]='!contact.phone' >