Angular 4 禁用的 FormControl 不检查或显示验证错误答案

【问题标题】：Angular 4 disabled FormControl does not check or show validating errorsAngular 4 禁用的 FormControl 不检查或显示验证错误
【发布时间】：2018-06-05 07:01:29
【问题描述】：

我将FormControl 对象绑定到input 元素。

<input matInput [formControl]="nameControl">

初始化如下

this.nameControl = new FormControl({value: initValue, disabled: true}, [Validators.required, UniqueValueValidator(uniqueValues)]);

当FormControl 被禁用时，它不会检查任何错误。

问题是我如何保持控件禁用并仍然显示错误。

【问题讨论】：

标签： javascript angular typescript angular4-forms

【解决方案1】：

当表单控件为disabled时，无法获得valid或invalid状态。

表单控件有四种状态：pending、disabled、valid 和 invalid，并且将只保留其中一种状态。所以当表单控件的状态为disabled时，只会是disable，不是valid，也不是invalid，见docs。

从技术上讲，您可以模拟验证过程，但任何基于 input.hasError('...') 或 invalid/valid 的东西都行不通。

<input matInput [formControl]="nameControl">
<div *ngIf="form.get('nameControl').disabled && form.get('nameControl').value === ''">
  field is required.
</div>

【讨论】：

但是是否不需要保持控件禁用但仍然能够显示错误（如果有）。（或者换句话说，我如何在 UI 上禁用控件但仍然能够在其上显示任何错误）
@kiranghule27 您可以在技术上模拟验证过程。但 IMO 不值得。我添加了一个示例，请参阅我更新的 anwser。