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>

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

1 个答案: