search

eakoriakin / ionic-selectable

Ionic Selectable is an Ionic versatile and highly customizable component that serves as a replacement to Ionic Select, and allows to search items, including async search, create items, customize the layout with templates and much more. It provides an intuitive API and is easy to set up and use.
MIT License
549 stars 125 forks source link

ionic-selectable design inside ng-content inside ion-item #393

Open mahrmartin opened 2 years ago

mahrmartin commented 2 years ago

If ionic-selectable is placed inside other wrapper component using ng-content, than it cannot query parents components using nativeElement.closest() and setup CSS classes properly (mainly ionic-selectable-has-label, ionic-selectable-label-default). Label and selected value is than displayed diferently.

FieldWrapper.html:

<ion-item>
    <ion-label>Whatever label</ion-label>

    <!-- ionic-selected will be placed inside ng-content -->
    <ng-content></ng-content>
</ion-item>

app.component.html:

<app-field-wrapper>
    <ionic-selectable
        ...
    ></ionic-selectable>
</app-field-wrapper>