当我以编程方式将新值推入该数组时，该数组的Angular5输入字段未显示ngModel的任何旧值

Question

我的angular5模板看起来像这样：

<div ngFor="for x of X">

  <input [(ngModel)]="x.name" type="text" class="form-control" name="name" maxlength="250" aria-required="true">

  <button (click)="null_append(X)">append</button>
</div>

我负责该模板的角度组件看起来像这样：

X=[
    {name:null}
  ]
  null_append(o){
    console.log(o);
    var null_found=false;
    for(let c of o){
      console.log(c.name)
      if(c.name==null){

        null_found = true;
      }
    }
    if(!null_found){
      o.push({name: null});
    }
  }

我面临的问题是，当将新元素推入该数组时，它会保留在数组中，但输入字段将变为空。 这不是我想要的东西。

Answer 1

问题出在名字上，我在所有输入字段中都使用了相同的名字。 我的工作版本如下：

<div ngFor="for x of X;let i = index">

  <input [(ngModel)]="x.name" type="text" class="form-control" name="name{{i}}" maxlength="250" aria-required="true">

  <button (click)="null_append(X)">append</button>
</div>