Angular Material表单验证错误消息不会消失

Question

我有一个材料表单，其中有MdInput：

<md-form-field class="input-full-width">
    <input mdInput class="form-control" type="text" placeholder="Description" formControlName="periodDesc">
    <md-error *ngIf="fb.get('periodDesc').errors.required">This field is required</md-error>
</md-form-field>

当触摸该字段但未输入任何文本时，将显示验证消息。但是，即使我尝试在其中键入文本，验证消息仍然存在：

修改1：

当我这样做时，问题得到修复：

<md-error *ngIf="fb.hasError('required', ['periodDesc'])">This field is required</md-error>

但是，我的问题是为什么问题首先出现？之前的案例是否有任何问题，因为我在第二个案例不起作用的其他地方使用它。参考：Angular Material forms validation errors

Answer 1

原因是当formControl没有验证器错误（请参阅 here ）时，fb.get('periodDesc').errors将返回 null 。因此，您当前的方式会像null error那样抛出can not find required of null。

使用fb.get('periodDesc').hasError('required')代替fb.get('periodDesc').errors.required来防止出现上述错误。