我想要一种方法从表单控件中删除特定错误,而不是清除所有错误。
control.setError({'firstError': true})
并删除
之类的特定错误control.removeError({'firstError}) and not control.setError({null})
我试过
control.setError({'firstError': false})
但没有用。
任何帮助。感谢
棱角分明4.1.1
答案 0 :(得分:14)
您可以使用以下方法消除错误:
control.setError({'firstError': null});
control.updateValueAndValidity();
答案 1 :(得分:6)
你可以这样删除:
control.setError({'firstError': null})
答案 2 :(得分:6)
此问题的其他帖子中已有很多说明(例如,删除错误属性(仍将控件标记为invalid
),updateValueAndValidity()
中的changeHandlers
问题(无穷大)循环)等)。综上所述,我现在使用下面的小功能,该功能使其他错误保持不变,并且如果没有其他错误,则重置无效标志:
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);
}
}
}
答案 3 :(得分:5)
首先,您应该检查您的字段是否有此错误。 接下来,将其删除。 最后,您需要更新控件中的所有错误。
验证器函数中的此类内容:
if (control.hasError('firstError')) {
delete control.errors['firstError'];
control.updateValueAndValidity();
}
致谢。
答案 4 :(得分:4)
我来自这个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();
答案 5 :(得分:1)
不幸的是,它对我没用。我只使用updateValueAndValidity()来重新计算值和验证。
以下是我的验证函数,它验证了我的grossWeight
。
validateWeights(formGroup) {
let netWeight = formGroup.get('netWeight');
let grossWeight = formGroup.get('grossWeight');
if (parseFloat(netWeight.value) > parseFloat(grossWeight.value)) {
grossWeight.setErrors({ 'customError': true });
netWeight.setErrors({ 'customError': true });
} else {
if(netWeight.errors && netWeight.errors['customError']) {
netWeight.updateValueAndValidity();
}
if (grossWeight.errors && grossWeight.errors['customError']) {
grossWeight.updateValueAndValidity();
}
}
}
答案 6 :(得分:1)
control.setErrors({'firstError': null});
将不再工作。您需要使用辅助方法。从https://github.com/angular/angular/issues/21564#issuecomment-480569715
复制public static removeErrors(keys: string[], control: AbstractControl) {
if (!control || !keys || keys.length === 0) {
return;
}
const remainingErrors = keys.reduce((errors, key) => {
delete errors[key];
return errors;
}, { ...control.errors });
control.setErrors(remainingErrors);
if (Object.keys(control.errors || {}).length === 0) {
control.setErrors(null);
}
}
答案 7 :(得分:0)
如果从Angular 8开始我们动态地添加和删除错误,则以上示例完全无效。我正在根据其他控件的状态添加错误。即我有两个使用相同电子邮件地址定义的客户。这是我能找到的唯一可行的解决方案。
tap(duplicateError => {
/* Note to future self...
* I'm beginning to hate AbstractControl.errors.
* The email control can have multiple errors (required, email, and duplicate);
* The ONLY way to clear an error is to not have it in the object that is passed to the setErrors call.
* You CANNOT pass null or undefined! It will still be evaluated as an error!
* This is also true if there are NO errors AT ALL. You cannot pass setErrors({}) or the control will be
* invalid, even though there are no errors! You must call setErrors(null);
* This is stupid, but it's the only way it works.
* This code is concerned with setting/removing the duplicate error.
*/
const email = this.form.get('email');
// Clone the existing errors
const existingErrors = { ...email.errors };
// Ensure that duplicate error is removed (we're in the change handler for the duplicate error)
delete existingErrors.duplicate;
if (duplicateError) {
// We have a new duplicate error, so add it.
email.setErrors({ ...existingErrors, duplicate: duplicateError.errorMessage });
} else if (Object.keys(existingErrors).length === 0) {
// We have NO errors, so pass null
email.setErrors(null);
} else {
// We have existing errors, but no new duplicate error. Pass the existing errors.
email.setErrors(existingErrors);
}
this.changeDetector.markForCheck();
})
答案 8 :(得分:0)
我正在使用动态表单,我想清除一个组件与另一个组件之间的错误。我尝试了 .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']);
答案 9 :(得分:0)
this.form.controls["field"].setErrors(null);
答案 10 :(得分:0)
我遇到此错误是由于使用* ngIf显示某些控件引起的。我想删除所有错误并从头开始,这行得通:
Object.keys(this.myForm.controls).forEach(controlName => {
if (controlName != "search") {
let control = that.myForm.controls[controlName];
if (control.errors) {
let errorKeys = Object.keys(control.errors);
errorKeys.forEach(key => {
delete control.errors[key];
})
}
control.setErrors(null);
this.options[controlName + "Error"] = null;
}
});
在我的代码中,我想单独保留“搜索”控件,并且我还要清除保存在this.options中的错误字符串。{controlName}错误
答案 11 :(得分:0)
要清除所有验证,您可以使用如下所示的 markAsUntouched
函数。
例如表单组控件:
for (let controlsKey in this.formGroup.controls) {
let control = this.formGroup.controls[controlsKey];
control.markAsUntouched();
}