角度抽象控件删除错误

Question

我想要一种方法从表单控件中删除特定的错误,而不是清除所有错误.

control.setError({'firstError': true})

并删除特定的错误,如

control.removeError({'firstError}) and not control.setError({null})

我试过了

control.setError({'firstError': false})

但没有奏效.

任何帮助.谢谢

角4.1.1

Answer 1

您可以删除错误:

control.setError({'firstError': null});

control.updateValueAndValidity();

Answer 2

您可以像这样删除:

control.setError({'firstError': null})

Answer 3

Much has already been stated in other posts to this question (e.g. delete the error property (which still leaves the control flagged as invalid), issues with updateValueAndValidity() in changeHandlers (infinite loop) etc). Putting it all together I now use the below small function, which leaves other errors untouched and resets the invalid flag if no other errors remain:

removeFormControlError(control: AbstractControl, errorName: string) {
  if (control?.errors && control?.errors[errorName]) {
    delete control.errors[errorName];
    if (Object.keys(control.errors).length === 0) {
      control.setErrors(null);
    }
  }
}

Answer 4

首先，您应该检查您的字段是否有此错误。接下来，将其删除。最后，您需要更新控件中的所有错误。

验证器函数中的内容如下：

if (control.hasError('firstError')) {
      delete control.errors['firstError'];
      control.updateValueAndValidity();
    }

问候。

Answer 5

我来自this github issue并尝试这个小解决方法

使用解构赋值

if ( control.hasError('errorToRemove') ) {
  const { errorToRemove, ...errors } = control.errors;
  control.setErrors(errors);
  control.updateValueAndValidity();
}

您还可以尝试omit或pick lodash功能，分别省略或挑选一系列您可以稍后设置到控件的错误。

const errors = pick(control.errors, ['onlyErrorsToKeep']);
control.setErrors(errors);
control.updateValueAndValidity();

const errors = omit(control.errors, ['allErrorsToRemove']);
control.setErrors(errors);
control.updateValueAndValidity();

Answer 6

我正在使用动态表单，我想从另一个组件中清除一个组件的错误。我尝试了.setErrors()方法，但它不起作用。下面列出了我的工作解决方案。

clearControlError( control: AbstractControl ): void {
    const err = control.errors;
    if (err) {
        delete err['timeNotValid'];
        if (!Object.keys(err).length) {
            control.setErrors(null);
        } else {
            control.setErrors(err);
        }
    }
}

现在我可以通过将任何 AbstractControl 类型控件传递给这样的函数来清除它的错误。

this.clearControlError(this.formBase.parent.get('startTime'));

或者

this.clearControlError(this.form.controls['startTime']);