Ion-select with *ngFor directive shows selected item Twice

I’m using ion-select to show dynamic data. I’m also comparing the values to show the selected value.

my code is as follows:

      <ion-select [(ngModel)]="editedItem">
        <ion-option *ngFor="let item of items; let i=index;" [value]="item" [selected]=" === selectedID"> {{ }}</ion-option>

when page is loaded, it shows the selected value twice separated by comma. if we assume there is foo in items array which has id 1 and selectedID is also 1, then selected value will be shown like:
foo, foo
but if I click on ion-select , all the items are single and if I select some other item, it shows single item and works fine.
Note: This behaviour is random , sometime it works fine. but most of the time it won’t.

the [selected] is not needed. just set the editedItem to the value of the selected option.

1 Like