radio-button - ngModel 单选按钮错过行为

Question

当我使用 ngFor 填充时，使用 ngModel 的单选按钮出现问题

1. 单选按钮选择行为不端
2. 在Form的console.log中，我看到gender的值是“it”

在此处输入图像描述

我在做什么错这是我的代码

app.component.ts 

gender :string[] = ["Male", "Female"];

app.component.html

<div class="radio" *ngFor="let it of gender">
   <label><input ngModel type="radio" name="gen"  value="it">{{it}}</label>
</div> 

标签： radio-buttonangular8ngmodel

Answer 1

玩了之后我找到了答案，问题是单选按钮的“值”，它必须是属性绑定的

<div class="radio" *ngFor="let it of gender">
   <label><input ngModel type="radio" name="gen"  [value]="it">{{it}}</label>
</div> 

或者

<div class="radio" *ngFor="let it of gender">
   <label><input ngModel type="radio" name="gen"  value={{it}}>{{it}}</label>
</div>