0

我在 Angular 应用程序中使用响应式表单。我有 2 个字段，一个是选择（命名客户端），另一个是输入（命名 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，但表单本身没有更新。只有当我单击输入字段并输入内容时才会更新。

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

谢谢

4

1 回答 1

3

为了成功更新控制模型，您可以使用ngModelproperty 而不是value.

它可能看起来像：

[ngModel]="clientCode$ | async"

Plunker 示例

于 2017-06-17T13:51:40.730 回答