How to add a flag icon in ion-select-option

@Rashadab wrote:

I am trying to add a flag icon inside a an ion-select-option.

  <ion-item>
    <ion-label>Popover</ion-label>
    <ion-select [interfaceOptions]="customPopoverOptions" interface="popover" placeholder="Select One">
      <ion-select-option value="brown">Brown</ion-select-option>
      <ion-select-option value="blonde">Blonde</ion-select-option>
      <ion-select-option value="black">Black</ion-select-option>
      <ion-select-option value="red">Red</ion-select-option>
    </ion-select>
  </ion-item>

Instead of the words, I want flags.
I am trying the following but it is not working

<ion-select [interfaceOptions]="customPopoverOptions" interface="popover">
  <ion-select-option value="brown"><span class='flag-icon flag-icon-gb-eng' slot="end"></span></ion-select-option>
  <ion-select-option value="blonde"><span class='flag-icon flag-icon-gb-eng' slot="end"></span></ion-select-option>
 <ion-select-option value="black"><span class='flag-icon flag-icon-gb-eng'slot="end"></span></ion-select-option>
<ion-select-option value="red"><span class='flag-icon flag-icon-gb-eng' slot="end"></span></ion-select-option>
  </ion-select>
                
                  

Posts: 1

Participants: 1

Read full topic