使用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對象。