angular - 如何在 Angular 8 中进行嵌套自定义验证

Question

我想检查两个不同字段 或条件之间的验证。假设我有两个字段年龄和出生日期。我只想检查一个需要年龄或出生日期的字段。

我正在使用 Angular 8。我的表单嵌套了添加更多功能。

标签： angularangular-reactive-forms

Answer 1

您可以编写自定义验证并检查您的流程。

this.userFormGroup= this.formBuilder.group({
   birth_date: [''],
   age : [''],
   }, {validator: this.customValidation});
customValidation(formGroup): any {
  const birthField = formGroup.controls['birth_date'].value;
  const ageField = formGroup.controls['age '].value;
  if (birthField && ageField) return null;
  if (birthField) return { ageRequired: true };
  if (ageField) return { birthRequired: true };
 }
}

<div *ngIf="!userFormGroup.valid"> 
  <p *ngIf="userFormGroup.hasError('ageRequired')">The age is required!</p>
  <p *ngIf="userFormGroup.hasError('birthRequired')">The birth date is required!</p>  
</div>