Angular2反应性表单控件验证取决于表单的外部属性

Question

我在angular2中使用了一些验证器，例如相等的密码验证器。在这些情况下，两个控件的格式相同，我可以使用指令的validate方法访问这两个控件。

但是在我的情况下，Form有一个名称为Email的表单控件，仅当EmailFlag为true时才需要。 EmailFlag不是表单控件，将随时更新其值。我在验证器的ngOnChanges中处理EmailFlag的更改值，并在验证器的validate方法中处理Email的更改。

仅当调用validate方法时，我才能访问并将验证设置为表单控制。但是在更改标志时，我无法获得表单控件并对其进行验证。有什么方法可以对标志更改进行表单控制并设置验证？

Directive

@Directive({
  selector: '[requiredIfTrue]',
  providers: [{
    provide: NG_VALIDATORS,
    useExisting: RequiredIfTrueValidator,
    multi: true
  }]
})
export class RequiredIfTrueValidator implements OnChanges {
  _emailFlag: boolean;
  @Input('requiredIfTrue') public requiredIfTrue: boolean;

  validate(control: AbstractControl): { [key: string]: any } | null {
    if (this._emailFlag) {
      //set validation
    }
    else {
      //remove validation
    }
  }

  ngOnChanges(change: SimpleChanges) {
    if (change.requiredIfTrue) {
      this._emailFlag = change.requiredIfTrue.currentValue;
    }
  }
}

component.ts

EmailFlag = false;
//flag declared and changes value time by time

component.html

<input type="text" formControlName="Email" class="form-control" [requiredIfTrue]="EmailFlag" />

Answer 1

您可以使用updateValueAndValidity强制检查有效性。您也可以在formGroup上运行它。看到这里：https://netbasal.com/three-ways-to-dynamically-alter-your-form-validation-in-angular-e5fd15f1e946