javascript - Angular 表单禁用绑定(bind)警告

Question

升级到 Angular 4 时，我在控制台中收到以下警告:

it looks like you're using the disabled attribute with a reactive form directive. If you set disabled to true when you set up this control in your component class, the disabled attribute will actually be set in the DOM for you. We recommend using this approach to avoid 'changed after checked' errors.ֿ

当做这样的事情时:

<input type="text" formControlName="name" [disabled]="isDisabled">

似乎 Angular 不再喜欢我们在表单控件上使用 disabled 属性。

发生了什么变化以及为什么会发生这种变化？

Answer 1

这意味着您正在通过属性绑定(bind)设置 disabled 属性，但您使用的 formControl 具有反应性。

因此，您应该在代码中声明 {disable: true}，如下所示，

form = new FormGroup({
    name: new FormControl({value: '', disabled: true})
  });

注意:如果您使用响应式(Reactive)表单，则应在 HTML 中定义 formGroup 属性。

<强> LIVE DEMO