在代码中检查以下两个问题:
命名冲突:确保模板中的表单控件名称与组件中相应的FormControl名称完全匹配。例如,如果在模板中有一个表单控件名称为“username”,则组件中的FormControl名称也应该是“username”。
控件初始化:在使用FormControl对象进行表单验证时,必须在组件中先定义并初始化该对象。如果FormControl对象未正确初始化,则可能会导致表单验证不起作用或出现意想不到的行为。以下是一个示例代码:
HTML模板:
组件:
import { Component, OnInit } from '@angular/core';
import { FormGroup, FormControl } from '@angular/forms';
@Component({
selector: 'my-component',
templateUrl: './my-component.component.html',
styleUrls: ['./my-component.component.css']
})
export class MyComponent implements OnInit {
myForm: FormGroup;
constructor() { }
ngOnInit() {
this.myForm = new FormGroup({
username: new FormControl(),
password: new FormControl()
});
}
}