how to show the selected value in radio button as checked when opening the ion-lost again after selection in ionic

Question

I have a field which opens a list having ion-radio.On selection of an option it shows the selected value as checked and when i open the list again, the checked value is not shown.

here is my code: code to show the options in modal controller :

 let modal = this.modalCtrl.create(ListComponent, { selectEmpType: type, selectValue: value, customiseColor: this.customiseColor , formMrType :formMrType, limitedRoleList : this.limitedRoleList, formType:this.formType,defaultOU1:this.defaultOus[0],defaultOU2:this.defaultOus[1],defaultOU3:this.defaultOus[2]});
  modal.onDidDismiss(data => {
      if (data.type == 'single') {
  this.setEmpValue(data.data, name); //data.data is the value that is selected from the list
}
}

in listcomponent.html:

<div *ngIf= "formMrType =='employee'">
      <ion-list radio-group [(ngModel)]="relationship">
        <ion-item *ngFor="let option of inputDatas">
        <ion-label>{{option.EMPFullName}}</ion-label>
        <ion-radio [checked]="option.checked" value="{{option.EMPFullName}}"></ion-radio>
      </ion-item>
     </ion-list>
    </div>

how to show the selected option as checked when opening the list for second time.

Answer 1

Preferably, you should be using ion-select for such functionality..

If you are using latest ionic versions ion-radio-group

But even in your case..you can try something like this...

<ion-radio [checked]="option.checked" value="{{option.EMPFullName}}" (ionBlur)="optionBlur(option)"></ion-radio>

optionBlur(option){
  if(!option['checked']){
    option['checked'] = true;
  }
  else{
    option['checked'] = !option['checked']
  }
}