Search code examples
angularangular-ng-if

how to bind Pre-populated data from object to radio button in Angular 5


I am working on Angular 5 application. I got radio button for Gender which value is pre-populated radio selection based on value it receving and I need to know how to use ng-if inline in html template. GenderType: string where value 1 is for male and 2 for female.

I have tried *ngIf but its not working out

 <div class="k-form-field">
     <span>Gender</span>
          <input type="radio" name="gender" id="female" class="k-radio" *ngIf:{{respondent.genderType='1'}} === checked="checked" disabled>
           <label class="k-radio-label" for="female">Female</label>

          <input type="radio" name="gender" id="male" class="k-radio" disabled>
             <label class="k-radio-label" for="male">Male</label>
  </div>

Solution

  • final answer that works for me

    <div class="k-form-field">
        <span>Gender</span>
          <input type="radio" name="gender" id="female" class="k-radio" [attr.checked] ="respondent.genderType=='2' ? 'checked' : null" disabled>
          <label class="k-radio-label" for="female">Female</label>
    
           <input type="radio" name="gender" id="male" class="k-radio" [attr.checked] ="respondent.genderType=='1' ? 'checked' : null" disabled>
           <label class="k-radio-label" for="male">Male</label>
    </div>