Search code examples
angular7ionic4

How to add country flags icon in front of ion-select-option?

I'm creating Ionic 4 plus Angular app, in that i'm using ion-select dropdown for country.now i want to add country flags icons in front of country name.below code shows what i'm try.

<ion-select class="dropdownselection" placeholder="PROVINCIA" interface="popover">
                  <ion-select-option value="A Coruña">
                    <ion-icon src="/assets/icons/man.svg"></ion-icon> A Coruña
                  </ion-select-option>
                  <ion-select-option value="Álava">Álava</ion-select-option>
                  <ion-select-option value="Albacete">Albacete</ion-select-option>
                  <ion-select-option value="red">D</ion-select-option>
                </ion-select>

i want flag icon before country name

Solution

  • I know in Ionic 3 there wasn't a a reliable way to add icons. I'm not sure about Ionic 4, but I use this plugin and its great.

    Here is an example.

    Another huge benefit of this plugin is you can search tons of data asynchronously.