Angular - FormControl未正确绑定到formControlName

Question

我正在使用FormGroup & FormControl手动创建表单模型，没关系，但是当我将FormControl绑定到它对应的输入时，我得到了意外的结果。

我创建了模型，并以这种方式绑定到html。

＆＃13;

＆＃13;

private initFormModel(user: User): FormGroup {
  const _formGroup = new FormGroup({
    fullname: new FormControl({ value: user.name })
  });
  return _formGroup;
}

＆＃13;

<!-- This is part of the html code / I set on my component class this.form = this.initFormModel(... -->

<form (ngSubmit)="onSubmit()" [formGroup]="form" novalidate>

<!-- .... --->

<input type="text" formControlName="fullname" name="fullname">

＆＃13;

＆＃13;

＆＃13;

结果

没有错，如果你希望我使用FormBuilder它不会改变任何东西。我得到[Object object]绑定到我的输入，有趣的是，如果我将禁用属性添加到我的表单控件定义，它将很好地工作。像：fullname: new FormControl({ value: user.name, disabled: false })我得到了绑定的文本，如果我使用数组表示法来创建FormControl（fullname: [user.name, ...]）。

以防我目前正在使用Angular v2.4.10

Answer 1

来自the documentation：

  

实例化FormControl时，可以传入初始值作为第一个参数。例如：

  const ctrl = new FormControl('some value');

  

您还可以在实例化时使用表单状态对象初始化控件，其中包括值以及是否禁用控件。 您无法在没有禁用密钥的情况下使用值键;两者都需要使用这种初始化方式。

  const ctrl = new FormControl({value: 'n/a', disabled: true});

（强调我的）