我使用以下表格:
<form [formGroup]="form" (ngSubmit)="onSubmit()" novalidate>
...
<div class="col-xs-12 nopadding">
<button class="btn loginbutton" type="submit" [disabled]="!submitEnabled()">Login</button>
</div>
</form>
在组件ts中,submitEnabled
如下所示:
submitEnabled(){
let enabled = false;
if(this.form.valid){
enabled = true;
}
return enabled;
}
或者我可以写[disabled]="this.form.valid"
(我正在使用被动表单,form
是表单的变量)。
注意:我使用Material作为输入的UI框架(可能不重要)
问题: 最初,我的表单始终无效。此表单是关于登录的。浏览器会自动填充值,因此会触及表单。这会导致表单触摸和脏。同时,表单仍然是无效,尽管表单包含有效数据。如果我点击网站上或表单内的任何地方,似乎再次检查有效性并且表单切换为有效。问题:即使表单包含有效数据,“登录”-Button最初也会被禁用。
有没有办法在自动填充后强制进行验证检查,还是我错过了以其他方式触发有效性检查的内容?
修改 在我使用的表单中,我有一个密码类型字段。此字段最初始终设置为无效。 的 EDIT2: 密码字段最初是不受影响和原始的,但它包含有效数据...