form.valueChanges 不为禁用的控件发出值

Question

我有一个 Angular 响应式表单。我订阅了它的值更改，并将更改发送到父组件。某些控件可能会被用户禁用。问题是发出表单 valueChanges 时，禁用控件的值会丢失。我设置了一个基本的 example.

选中复选框并禁用电子邮件输入时，不会记录任何表单控件值。但我想获取所有表单值。

Answer 1

来自禁用输入的值被忽略（尝试提交带有禁用输入的表单：它不会被发布）。

你可以改成'readonly'

<input formControlName="email" [readonly]="cb.checked">
<input #cb type="checkbox" formControlName="toggleEmail">

Updated example.

Answer 2

使用 FormGroup 的 getRawValue() 来包含控件值，而不考虑 enable/disable 状态。

More information in the API documentation

this.myForm.valueChanges.subscribe(() => {
    this.formValues =  JSON.stringify(this.myForm.getRawValue());
});

Here is the forked example