首页 > 解决方案 > 使用 clearValidators() 后所需的验证器仍然处于活动状态

问题描述

我有一个行列表,每行都有一些选择、输入和一个看起来像这样的复选框

<mat-checkbox [(ngModel)]="chargeApply[charge]" [ngModelOptions]="{standalone: true}"
            (change)="setChargeValidators(charge, $event.checked)"></mat-checkbox> 

目的是让 setChargeValidators 为选择/取消选择的行添加/删除验证器,这就是函数(有很多额外的东西可以正常工作,我没有解释这个函数,重要的部分是清除验证器当 selected 为 false 时,CELL_VALIDATION 是一个包含 Validators.required 的数组):

setChargeValidators(charge: string, selected: boolean) {
if (selected) {
  this.chargesSelected = true;
  this.chargesForm.controls[charge + '20'].setValidators(CELL_VALIDATION);
  this.chargesForm.controls[charge + '40'].setValidators(CELL_VALIDATION);
  this.chargesForm.controls[charge + '40hc'].setValidators(CELL_VALIDATION);
  this.chargesForm.controls[charge + 'Currency'].setValidators(Validators.required);
  this.chargesForm.controls[charge + 'Unit'].setValidators(Validators.required);
} else {
  const controlNames = ['20', '40', '40hc', 'Currency', 'Unit'];
  for (let name of controlNames) {
    if (name !== 'Currency' ) {
      this.chargesForm.controls[charge + name].reset();
    }
    this.chargesForm.controls[charge + name].clearValidators();
  }

  for (let chargeName in this.chargeApply) {
    if (this.chargeApply[chargeName]) {
      return;
    }
  }
  this.chargesSelected = false;
}

this.updateForm(charge);}

UpdateForm 看起来像这样

updateForm(charge) {
const controlNames = ['20', '40', '40hc', 'Currency', 'Unit'];
for (let name of controlNames) {
  this.chargesForm.controls[charge + name].updateValueAndValidity();
  // debugger
}

}

但是,当我取消选择一行时,该行的所有 FormControls 都有

错误:{必需:真}

似乎所有验证器都在清除,除了 Validators.required。我试过做

this.chargesForm.controls[charge + name].clearAsyncValidators();

除了 clearValidators() 之外,没有任何效果(这是有道理的,因为我没有设置任何异步验证)。我也尝试过这个解决方案,但没有运气。

感谢您的时间。

标签: angularangular6angular-reactive-formsangular-validationreactive-forms

解决方案


推荐阅读