2016-12-06 28 views
4

ReactiveFormsModuleを使用してフォームを作成しています。反応性フォームに少なくとも1つの値が必要です

私は入力連絡先の詳細にユーザを必要とする:

  • 自宅の電話番号
  • 自宅や携帯電話のいずれかの場合には、携帯電話の番号
  • メール

フォームは、有効である必要があり数字が入力された場合は、、少なくとも1つはが必要です。電子メールはオプションです。

this.contact = this.fb.group({ 
    'Festnetz': [], 
    'Mobil': [], 
    'Email': [], 
}); 

this.contact.valueChanges.subscribe(form => { 
    console.log(form, this.contact.status); 
}); 

FormBuilderを使用して宣言する方法はありますか?

答えて

3

あなたはこのような何か行うことができます。

 this.contact = this.fb.group({ 
     'Festnetz': [], 
     'Mobil': [], 
     'Email': [], 
    },{validator:(formGroup:FormGroup)=>{ 
return this.validatePhone(formgroup); 

    }); 

validatePhone(formgroup:FormGroup){ 
    if(formgroup.controls["Festnetz"].value || formgroup.controls["phone"].value){ 
      return {validatePhone:true}; 
      } 
      else{ 
      return null; 
      } 
    } 

ORあなたの携帯電話番号用に別のグループを作成することができます。

this.contact = this.fb.group({ 
    'phoneGroup':this.fb.group({ 
     'Festnetz': [], 
      'Mobil': [] 
    },{validator:(formgroup:FormGroup)=>{ 
     return this.validatePhone(formGroup); 

     }), 
      'Email': [], 
     }); 

validatePhone(formgroup:FormGroup){ 
if(formgroup.controls["Festnetz"].value || formgroup.controls["phone"].value){ 
     return {validatePhone:true}; 
     } 
     else{ 
     return null; 
     } 
} 

注:私は「Festnetz」は携帯電話の一つであると仮定していますが数字

関連する問題