问题描述: 在Angular 2应用程序中,自定义表单验证器可能不起作用,并且会引发错误“Cannot read property 'value' of null”。
解决方法: 这个错误通常是由于在表单控件上应用自定义验证器时引发的。以下是解决这个问题的一些可能的方法。
this.form = this.formBuilder.group({
myControl: ['', [myCustomValidator]]
});
function myCustomValidator(control: AbstractControl): ValidationErrors | null {
// 验证逻辑
}
function myCustomValidator(control: AbstractControl): ValidationErrors | null {
if (control.value === 'invalid') {
return { myError: true };
}
return null;
}
this.form = this.formBuilder.group({
myControl: ['', [myCustomValidator]],
});
*ngIf
或其他条件语句来控制表单控件的显示和隐藏,请确保自定义验证器函数适用于控件的实际显示状态。
在这种情况下,可以在自定义验证器函数中检查控件的显示状态。
function myCustomValidator(control: AbstractControl): ValidationErrors | null {
if (control.visible && control.value === 'invalid') {
return { myError: true };
}
return null;
}
这些解决方法应该能够解决“Angular 2 - 自定义表单验证器不起作用 - 无法读取 null 的属性'value'”错误。如果问题仍然存在,请检查其他可能导致问题的原因,例如表单的初始化或其他相关代码。