web-dev-qa-db-ja.com

AngularJSを使用して条件付きでフォーム入力を要求する方法を教えてください。

AngularJSを使用してアドレス帳アプリケーション（考案例）を作成しているとします。

電子メールと電話番号の入力を持つ連絡先のフォームがあります。どちらか一方が必要ですが、両方ではありません：emailname__入力のみphonename__入力が空または無効の場合は必須です。逆の場合も同様です。

Angularにはrequiredname__ディレクティブがありますが、この場合の使い方はドキュメントからは明らかではありません。では、どうすればフォームフィールドを条件付きで要求できるのでしょうか。カスタムディレクティブを書く？

formsvalidationangularjs
230
Christian Smith

カスタムディレクティブを書く必要はありません。 Angularのドキュメントは優れていますが、完全ではありません。 実際には 、Angular式を取るngRequiredというディレクティブがあります。

<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/

456
Christian Smith

otherが書かれている場合に必要な入力を入れたい場合は、

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

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

よろしく。

22
David Gonzalez

簡単にあなたはのような角度検証を使用することができます：

 <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' />

1つのテキストフィールドにのみ値を入力できます。どちらかを記入することができます姓または名。このようにして、AngularJで条件付き必須入力を使用できます。

11
Bipin Shilpakar

Angular2の場合

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