how to bind two-way radio button in angular 2
For two way data binding its as same as all others use this syntax [(ngModel)]
Replace your code block with below:
<div class="form-group">
<label>Gender:</label>
<label class="radio-inline">
<input type="radio" name="optradio" value='Male' [(ngModel)]="employee.gender" >Male
</label>
<label class="radio-inline">
<input type="radio" name="optradio" value='Female' [(ngModel)]="employee.gender" >Female
</label>
</div>
You can try this
<div class="form-group">
<label>Gender:</label>
<label class="radio-inline">
<input type="radio" name="gender" [(ngModel)]="employee.gender"
[value]='Male' [checked]="employee.gender == 'Male'" >Male
</label>
<label class="radio-inline">
<input type="radio" name="gender" [(ngModel)]="employee.gender"
[value]='Female' [checked]="employee.gender == 'Female'" >Female
</label>
</div>
Also, you forgot to add the [value]
property in your inputs and change the name
of the input
to gender