要解决Angular表单验证提交按钮不能正确禁用的问题,可以按照以下步骤进行:
[disabled]
属性来禁用按钮。示例代码如下:
username
和password
,并使用ngModel
指令将其与表单控件绑定。import { Component } from '@angular/core';
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
username: string;
password: string;
}
使用[disabled]
属性来禁用提交按钮。该属性的值为!myForm.valid
,表示只有当表单验证通过时按钮才可用。
在表单中添加required
属性来设置必填项,并使用[(ngModel)]
指令将表单控件与组件类中的属性进行绑定。
通过以上步骤,即可实现在Angular中正确禁用表单验证提交按钮。