Question

如何在ngFor重复的多个表单中使用ngModel进行输入？

当我试图这样做时，Angular2给了我错误。

Error: Permission denied to access property "rejection"

有问题代码的示例块：

<div *ngFor="let item of items">
    <form name="itemForm">
        {{item.name}}<input [(ngModel)]="item.name">
    </form>
</div>

这是掠夺者 https://plnkr.co/edit/YNZiCBeyqJoxO5ox5nlC?p=preview

如果我删除了表单标签，它都运行没有问题，但我需要它，所以我可以在所有输入上使用回车键以自己的形式更新相应的数据。

Answer 1

如果在表单标记中使用了ngModel，则必须设置name属性，或者必须将表单控件定义为“独立”＃39}。在ngModelOptions。

以下工作没有任何错误：

<div *ngFor="let item of items">
  <form name="itemForm">
    {{item.name}}<input [(ngModel)]="item.name" [ngModelOptions]="{standalone: true}">
  </form>
</div>

Answer 2

正如@ ranakrunal9所指出，您可以为输入使用唯一名称属性。代码如下：

destroy

Angular2不能在ngFor重复的形式中使用ngModel

2 个答案: