假设我们正在用AngularJS构建一个地址簿应用程序(虚构的例子)。

我们有一个联系人表单,其中有电子邮件和电话号码的输入,我们希望只需要其中一个,而不是两个:我们只希望在电话输入为空或无效时需要电子邮件输入,反之亦然。

Angular有一个required指令,但是从文档中看不清楚在这种情况下如何使用它。那么我们如何有条件地要求表单字段呢?写一个自定义指令?


当前回答

在AngularJS(版本1.x)中,有一个内置指令ngrerequired

<input type='email'
       name='email'
       ng-model='user.email' 
       placeholder='your@email.com'
       ng-required='!user.phone' />

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

在Angular2或更高版本中

<input type='email'
       name='email'
       [(ngModel)]='user.email' 
       placeholder='your@email.com'
       [required]='!user.phone' />

<input type='text'
       [(ngModel)]='user.phone'             
       placeholder='(xxx) xxx-xxxx'
       [required]='!user.email' /> 

其他回答

对于Angular 2

<input [(ngModel)]='email' [required]='!phone' />
<input [(ngModel)]='phone' [required]='!email' /> 

对于Angular2

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

简单,你可以像这样使用角验证:

 <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中使用条件必填。

如果你想输入一个要求,如果other被写入:

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

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

的问候。

没有必要编写自定义指令。Angular的文档很好,但并不完整。事实上,有一个叫ngrerequired的指令,它接受一个Angular表达式。

<input type='email'
       name='email'
       ng-model='contact.email' 
       placeholder='your@email.com'
       ng-required='!contact.phone' />

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

这里有一个更完整的例子:http://jsfiddle.net/uptnx/1/