问题描述:
在Angular 6中,当调用this.formGroup.updateValueAndValidity()
时,表单验证似乎不起作用,即使输入字段的值已更改也是如此。
解决方法: 以下是一些可能的解决方法和代码示例:
formControlName
指令将控件绑定到表单组。示例如下:在模板中:
在组件中:
import { FormGroup, FormControl } from '@angular/forms';
// 创建表单组和控件
formGroup: FormGroup = new FormGroup({
name: new FormControl('')
});
在组件中:
import { FormGroup, FormControl } from '@angular/forms';
// 创建表单组和控件
formGroup: FormGroup = new FormGroup({
name: new FormControl('')
});
ngOnInit() {
// 订阅表单控件值的更改
this.formGroup.get('name').valueChanges.subscribe(() => {
// 更新表单值和有效性
this.formGroup.updateValueAndValidity();
});
}
在组件中:
import { FormGroup, FormControl, Validators } from '@angular/forms';
// 创建表单组和控件
formGroup: FormGroup = new FormGroup({
name: new FormControl('', [Validators.required, this.customValidator])
});
customValidator(control: FormControl) {
// 自定义验证逻辑
if (control.value === 'abc') {
return { invalidValue: true };
}
return null;
}
在模板中,你可以通过formGroup.controls['name'].errors
获取自定义验证器返回的错误对象。
这些解决方法应该可以帮助你解决Angular 6中this.formGroup.updateValueAndValidity()
不正常工作的问题。请根据你的实际情况选择适合的解决方法。