Question

我坚持使用Angular 2表格。我想要一个单点检查整个表单是否有效，所以我将所有控件放在<form>标记内。这会导致错误消息：

Error: If ngModel is used within a form tag, either the name attribute must be set or the form control must be defined as 'standalone' in ngModelOptions.

  Example 1: <input [(ngModel)]="person.firstName" name="first">
  Example 2: <input [(ngModel)]="person.firstName" [ngModelOptions]="{standalone: true}">

很明显，在SO上已经有一些问题了。第二个示例不是选项，因为未使用整个表单验证独立控件。所以我绝对需要一个名字。

问题是：我没有任何可以用作名称的独特之处。表单显示实体的动态集合，其名称将由用户输入。我尝试在集合中使用元素索引，但是当我添加或删除元素时，这也会改变。 Angular似乎无法处理更改表单元素名称，正如您在plunker中看到的那样。（只需更改第二个元素，删除第一个元素并添加另一个元素 - 它将产生奇怪的结果。）

有没有办法解决这个问题而不用手动验证每个表单控件？

Answer 1

我猜你使用了*ngFor对吗？

如果是这样，您可以使用自定义trackBy函数，并在索引后命名它们。这会给出

<div *ngfor="let x of y; let i = index; trackBy: myTrackBy" [name]="'myField_' + i">...</div>

在您的TS中

myTrackBy(index, item) {
  return item.id || index; // try returning the item ID first, otherwise the index
}

Angular 2表单控件没有名称

1 个答案: