输入字段未在Reactive Forms Angular 4中更新

Question

我在Angular应用程序中使用反应形式。 我有2个字段，一个字段是一个select（命名为client），另一个字段是一个输入（命名为clientCode），用户必须对其进行更新，以便用户选择一个新的客户端。

<select formControlName="client">
            <option value="">Client</option>
            <option *ngFor="let item of data.clients" [value]="item.value">{{ item.value }}</option>
          </select>
          <input type="text" formControlName="clientCode" placeholder="Client Code" value="{{ clientCode$ | async }}">

我在客户端上使用valueChanges，以便当用户选择一个客户端时，我获得与该客户端关联的代码，并将其作为Observable（clientCode $）返回，然后更新输入值。

this.clientCode$ = this.summary
      .get('client')
      .valueChanges.map(val => this.clientsMap.get(val));

这在我的屏幕上有效，因为显示了clientCode，但是表单本身未更新。 仅当我单击输入字段并键入内容时，才会更新。

有没有什么办法解决这一问题？

谢谢

Answer 1

为了成功更新控件模型，可以使用ngModel属性而不是value 。

它可能看起来像：

[ngModel]="clientCode$ | async"

柱塞示例