feat: ion-select / ion-select-option to support custom HTML to show images or other HTML content.

[Saqib92]

Prerequisites

• I have read the Contributing Guidelines.
• I agree to follow the Code of Conduct.
• I have searched for existing issues that already include this feature request, without success.

Describe the Feature Request

We would love to have a support for custom HTML in ion-select / ion-select-option.

Describe the Use Case

For example i have a scenario to show Images with options text for multiple / single selection. custom HTML would be very helpful.

<ion-select label-placement="stacked" fill="outline" class="ion-margin-bottom"  mode="md" interface="popover">
    <div slot="label">User Shift</div>

    @for(item of items; track item?.name){
    <ion-select-option [value]="item?.value">
      <img [src]="item.image" />
      {{s?.name}}
    </ion-select-option>
    }

  </ion-select>

Describe Preferred Solution

ng-selet
ng-select is a good alternative but customizing UI to look like ionic component is very difficult.

Describe Alternatives

https://www.npmjs.com/package/@ng-select/ng-select

Related Code

<ion-select label-placement="stacked" fill="outline" class="ion-margin-bottom"  mode="md" interface="popover">
    <div slot="label">User Shift</div>

    @for(item of items; track item?.name){
    <ion-select-option [value]="item?.value">
      <img [src]="item.image" />
      {{s?.name}}
    </ion-select-option>
    }

  </ion-select>

Additional Information

Custom HTML in select-option would be great value addition to ionic.