使用NgFor创建单选按钮

Question

我想使用NgFor创建一组单选按钮作为表单的一部分。他们似乎很好，但只要我得到NgModel涉及它打破，以便点击任何他们总是选择最后一个（除了最后一个选择倒数第二）。

I have set up a plunk of the issue

一切似乎如果从线模板12但最终去除ngModel没有，我的方式是死在水中正常工作。对？

任何建议将是伟大的。我是一个适合新手的形式，并且是一个相对于NgModel的新手。

干杯

Answer 1

绑定到输入时删除attr部分。

从这：

<input type="radio" name="gameType" [attr.id]="'gameType'+i" [attr.value]="i" ngModel> 

要这样：

<input type="radio" name="gameType" [id]="i" [value]="i" ngModel> 

这里的修改plunker

Answer 2

你可以只改变如下：

<input type="radio" name="gameType" [attr.id]="'gameType'+i" [attr.value]="i" ([ngModel])="defaultSpecs[i].model"> 

这会告诉ngModel使用双向绑定（中添加的盒子语法香蕉）和变异的defaultSpecs反对包括一个名为属性模型，其中包含一个布尔值，表示它是否被选中。

使用重复索引作为其数组引用您的defaultSpecs对象。