проверенное свойство не работает с ngModel

Question

У меня есть следующий код внутри формы:

<div class="radio" *ngFor="let gender of genders">
  <label>
    <input type="radio" name="gender" ngModel [value]="gender" [checked]="gender==='male'" />
    {{gender}}
  </label>
</div>

В этой ситуации ни одна кнопка не включена по умолчанию. Однако, если я удалю ngModel, опция «male» будет включена по умолчанию, как и ожидалось. Чего мне не хватает?

Answer 1

Ну, это было и просто, и не интуитивно понятно. Решение состоит в том, чтобы изменить переключатель следующим образом:

<input type="radio" name="gender" [(ngModel)]="selectedGender" [value]="gender" [checked]="gender==='male'" />

, а затем добавьте «selectedGender» в качестве свойства компонента.