Angular6 - Render images inside dropdown list

Asked Mar 17 '19 at 14:04

Active Mar 17 '19 at 14:04

Viewed 537 times

I am trying to create html dropdown with svg images. My code below doesn't display any image:

<select name="options">
   <option class="en" value="en" 
      style="backgroundimage:url('assets/svg/en.svg');">English
   </option>

   <option class="fr" value="fr"
      style="background-image:url('assets/svg/fr.svg');">French
   </option>

   <option class="pl" value="pl"
      style="background-image:url('assets/svg/pl.svg');">Polish
   </option>

   <!-- this way doesn't work eighter. -->
   <option><img class="country-flag" src="assets/svg/en.svg"></option>

</select>

I know it can be done with third-party library. But I am looking for solution in html/css/typescript. Using Angular6. Thanks.

asked Mar 17 '19 at 14:04

hitenz

Possible duplicate of [How to add images in select list?](https://stackoverflow.com/questions/2965971/how-to-add-images-in-select-list) – Antoine Boisier-Michaud Mar 17 '19 at 14:44
@AntoineBoisier-Michaud I saw that topic before. Non of these is acceptable for me. – hitenz Mar 17 '19 at 18:20

Angular6 - Render images inside dropdown list

0 Answers0