以编程方式触发 Angular Material 触发触摸状态

Question

我将 Angular 4 响应式表单与 @angular/material 结合使用版本 2.0.0-beta.10 .我需要以编程方式制作 md-error消息出现。

在必填字段上，当用户没有输入任何文本就留下输入时，我有一个 md-error上面写着，“这个字段是必需的。”见代码:

<md-form-field>
    <input mdInput type="text"
           formControlName="PartNumber"
           placeholder="Part Number"
           maxlength="250"
           required />
    <md-error *ngIf="formGroup.controls['PartNumber'].hasError('required')">
        Part Number is <strong>required</strong>
    </md-error>
</md-form-field>

我都试过了:

this.formGroup.markAsTouched();
this.formGroup.markAsDirty();

md-error <input> 下方的文字当我调用 markAsTouched() 时没有出现或 markAsDirty() .

如何以编程方式触发触摸状态以显示错误消息？

Answer 1

解决方案是遍历每个控件并将每个控件标记为已触摸:

Object.keys(this.formGroup.controls).forEach(key => {
    const ctrl = this.formGroup.get(key);
    ctrl.markAsTouched({ onlySelf: true });
});