ionic-selectable icon indicating copy to clipboard operation
ionic-selectable copied to clipboard

Item values exceeds input-box

Open alexismpro opened this issue 3 years ago • 0 comments

Issue description

When using the style "outline" (from Ionic) for an ion-item containing an ionic-selectable (with multiple selections enabled and the Multiple values with ellipsis template), the values exceeds from the box borders.

Versions

  • Ionic: 6.19.1
  • Angular: 13.2.6
  • Capacitor: 3.5.1
  • NodeJS: 16.15.0
  • npm: 8.5.5

Stackblitz example

* Currently not working...

Error in /turbo_modules/@angular/[email protected]/fesm2015/core.mjs (1150:15) Type L does not have 'ɵmod' property.

Seems to be coming from this import: import { IonicModule } from '@ionic/angular';

Had to update imports versions because otherwise the fill="outline" style wouldn't exist. But these new imports have caused the problem.

Anyway, all the code and dependencies are in here: https://stackblitz.com/edit/ionic-selectable-grouping-ab49zt?file=app/pages/home/home.html

Code to reproduce

            <ion-item fill="outline">
                    <ion-label position="floating">{{"students" | translate}}</ion-label>
                    <ionic-selectable item-content [(ngModel)]="selectedstudents" [items]="students" itemValueField="id" temTextField="name" [isMultiple]="true" [canClear]="true">
                            <ng-template ionicSelectableValueTemplate let-students="value">
                                    <div class="ionic-selectable-value-item">
                                            {{formatMultipleValues(students)}}
                                    </div>
                            </ng-template>
                    </ionic-selectable>
            </ion-item>

alexismpro avatar Jun 01 '22 19:06 alexismpro