要解决Angular表单验证未显示错误消息的问题,可以按照以下步骤进行:
myField
),并根据需要设置验证器。例如,如果需要required
验证器,可以在组件类中添加以下代码:import { Component } from '@angular/core';
@Component({
selector: 'app-my-component',
templateUrl: './my-component.component.html',
styleUrls: ['./my-component.component.css']
})
export class MyComponent {
myField: string;
// 其他代码...
}
import { Component } from '@angular/core';
import { NgForm } from '@angular/forms';
@Component({
selector: 'app-my-component',
templateUrl: './my-component.component.html',
styleUrls: ['./my-component.component.css']
})
export class MyComponent {
myField: string;
submitForm(myForm: NgForm) {
if (myForm.invalid) {
// 显示表单错误消息
Object.keys(myForm.controls).forEach(key => {
myForm.controls[key].markAsDirty();
myForm.controls[key].markAsTouched();
});
return;
}
// 处理表单提交逻辑
}
}
通过上述步骤,当表单控件验证失败时,错误消息将会显示出来。
上一篇:Angular表单验证提示打印
下一篇:Angular表单验证问题