formArray中的单选按钮

Question

我正在制作一个表单，其中有一个formmarrayname，我想使用一个单选按钮。问题是所有这些单选按钮都有相同的名称，所以当我点击一个时，所有其他的单选按钮都关闭。

如果我给单选按钮一个带有索引(name[i])的名称，我得到错误消息:

platform-browser.umd.js:1900 ORIGINAL EXCEPTION: If you define both a name and a formControlName attribute on your radio button, their values must match. Ex: <input type="radio" formControlName="food" name="food">

我不知道如何解决这个问题。我不能给init函数下标因为数组的下标可以改变。下面是我的代码示例:

编辑:做了一个普朗克的例子:http://plnkr.co/edit/o2ZxAFsuhD0F7OKevqei?p=preview

有人能帮我吗?

Answer 1

你需要让angular设置input的name属性:

<input type="radio" [attr.name]="'sex' + i" value="male"> male
<input type="radio" [attr.name]="'sex' + i" value="female"> female

Answer 2

省略name属性为我解决了这个问题。

Answer 3

不使用多个form元素在技术上似乎是不可能的。