Question

这是Angular 5和Firestore项目。我正在使用带有[(ngModel)]的表单来更新数据库中的文档。更新成功。但是[(ngModel)]在输入框中本身显示文档字段值的方式是不正确的，例如占位符是错误的。每个输入框应该在不同时显示相同的字段值。例如

在数据库中，我的文档看起来像这样

document
  field1: document title
  field2: google
  field3: https://www.google.com

但是我的输入框显示了

input box 1显示https://www.google.com

input box 2显示https://www.google.com

input box 3显示https://www.google.com

这是HTML

<ng-container *ngFor="let x of xyz | async">
  <div class="columns">
    <div class="column">
      <form>
        <input [(ngModel)]="x.field1" #v1>
        <input [(ngModel)]="x.field2" #v2>
        <input [(ngModel)]="x.field3" #v3>
        <button (click)="update(v1.value, v2.value, v3.value)">update</button>
      </form>
    </div>
    <div class="column">
      {{x.field1}} #### <-- THESE WORK FINE
      {{x.field2}}
      {{x.field3}}
    </div>
  </div>
</ng-container>

我在component.ts中缺少什么吗？

Answer 1

您必须给输入内容起一个名字。而且每个输入必须有一个不同的输入。

ngModel为不同的字段显示相同的值

1 个答案: