CODEWITHSUNDEEP
javascriptcssangular
Jason Sprague
Jason Sprague

Reputation: 85

How to add images to select option field in Angular (template driven form)?

Im working on a project using ng-bootstrap and Angular 9. The client requested credit card images next to the options in a dropdown select list. Needs to work in multiple browsers. The code below is from my form.component.html file. Any and all recommended solutions are welcome.

 <form>
<label>Card Type: </label>
      <select class="form-control">
        <option>Visa</option>
        <option>MasterCard</option>
        <option>American Express</option>
</select>
</form>

Upvotes: 0

Views: 548

Answers (1)

IDK4real
IDK4real

Reputation: 1042

Unfortunately, it is not possible to place an HTML tag inside an option therefore you cannot place images or other elements inside the options element.

Furthermore, this issue is a duplicate of a duplicate.

There are several ways to go around the problem explained there in the first link so you should see which is applicable to your project.

Sorry for not being able to provide a direct solution.

Kind regards.

Upvotes: 1

Related Questions