html - IONIC 2 radio button inside Virtual scrolling ,multiple option getting selected automatically if I select any one of the option -
here code virtual scrolling
<ion-list [virtualscroll]="options" *ngif="options.length>99" radio-group style="opacity: 0.9;"> <ion-item *virtualitem="let option"> <ion-label style="font-size: 12pt" text-wrap>{{ option.optiontext }} </ion-label> <ion-radio value='{{ option.optionid }}' (ionselect)="setselectedoption(option)"></ion-radio> </ion-item> </ion-list>
any appreciated thanks
edit-i found out issue has been raised on github still if me workaround helpful
ok you're looking workaround.
if @ docs <ion-radio>
, there option called checked
, normal radio button. mean this:
<ion-radio value='{{ option.optionid }}' (ionselect)="setselectedoption(option)" [checked]="ischecked(option.optionid)"></ion-radio>
ts
options: = []; selectedoptions: number[] = []; constructor() {} setselectedoption(option: any) { let index = this.selectedoptions.indexof(option.optionid); if(index > -1) { this.selectedoptions.push(option.optionid); } else { this.selectedoptions.slice(index, 1); } } ischecked(id: number): boolean { // true if id in selectedoptions, false if isn't return (this.selectedoptions.indexof(id) > -1); }
edit
try normal html radio inputs since ionic ones seem bugged then
<form action=""> <ion-list [virtualscroll]="options" *ngif="options.length>99" style="opacity: 0.9;"> <ion-item *virtualitem="let option"> <ion-label style="font-size: 12pt" text-wrap>{{ option.optiontext }} </ion-label> <input type="radio" [value]="option.optionid" (click)="setselectedoption(option) [checked]="ischecked(option.optionid)"> </ion-item> </ion-list> </form>
Comments
Post a Comment