Data binding ngFor内部的Angular2 ngModel

我试图从输入绑定字符串数组，因此在html文件中我写了以下内容：

<div *ngFor="let word of words; let in=index" class="col-sm-3">
      <div class="form-group">
        <input type="text" [(ngModel)]="words[in]"  class="form-control" [attr.placeholder]="items[in]" required>
      </div>
  </div>

查询是表单组件中的查询数组：

queries:Query[] = [];

---

谢谢你的帮助

问题在于在

ngFor

中使用基本值数组（

words

）

您可以将单词更改为对象数组，如

words = [{value: 'word1'}, {value: 'word2'}, {value: 'word3'}];

像这样使用它

  <div *ngFor="let word of words; let in=index" class="col-sm-3">
      <div class="form-group">
        <input type="text" [(ngModel)]="words[in].value"  class="form-control" [attr.placeholder]="items[in]" required>
      </div>
  </div>

---

使用trackBy也可以解决这个问题，但我不确定。

通过使用@Input（）函数并传递查询数组+查询索引号来解决这个问题。感谢大家的支持。

每个输入标记都必须定义一个唯一的“name”属性，如中所述：

以下是更正后的代码：

<div *ngFor="let word of words; let in=index" class="col-sm-3">
  <div class="form-group">
    <input type="text" [(ngModel)]="words[in]" name="word{{in}}" class="form-control" [attr.placeholder]="items[in]" required>
  </div>

---

对我来说，问题还不清楚。如果你能明确说出你到底想要什么？在多次测试之后，我的问题是在查询词被更新后将它们发回我的表单组件。每个输入标记必须定义一个唯一的name属性。你好，那里！你能再解释一下这个问题吗？老实说，我不明白OP的要求，但两种方法（原语数组或对象数组）似乎都能正常工作：……我试过了，但仍然不起作用。顺便说一下，我尝试在输入上添加事件键控，并将单词数组记录在同一组件中。annd它起作用了，所以我的问题是将单词数组传回表单（父）组件。@e.m.b“不起作用”没有提供太多信息。@acdcjunior如果在plunker中写入，则在前两个输入字段中，它们在每次按键后都会失去焦点，而在较低的输入中，您可以正常写入。对于基元值，每次更改后都会重新创建行，因为每次更改值时都会替换数组值，而输入会因为删除而增加另一个而失去焦点。在较低的输入中，只有值会更改，但

*ngFor

不必重新创建行。console.log（this.querys）在表单组件中显示一个空单词数组。是的，我遇到了这种情况，并通过提供不同的名称来解决。非常感谢，至少举个例子说明你是如何做到的

<div *ngFor="let word of words; let in=index" class="col-sm-3">
  <div class="form-group">
    <input type="text" [(ngModel)]="words[in]" name="word{{in}}" class="form-control" [attr.placeholder]="items[in]" required>
  </div>