Whenever I bind a property to ngModel, it consistently returns undefined
<div>
<input
type="radio"
name="input-alumni"
id="input-alumni-2"
value="true"
[(ngModel)]="isAlumni"
(change)="handleAlumiSelect($event)"
required
/>
<label for="input-alumni-2"> Yes</label>
</div>
<div>
<input
type="radio"
name="input-alumni"
id="input-alumni-1"
value="false"
[(ngModel)]="isAlumni"
(change)="handleAlumiSelect($event)"
/>
<label for="input-alumni-1"> No</label>
</div>
In my handleAlumiSelect function, I console.log the following:
public isAlumni: any;
handleAlumiSelect(e: any) {
console.log('handleAlumiSelect');
console.log(e.target.value);
console.log(this.isAlumni);
}
While e.target.value displays the correct answer, this.isAlumni constantly remains as "undefined". Can someone explain why this happens?