Ionic 7 (angular) and swiper 11.0.3 event did not trigger

Ionic Framework Ionic Angular
1

Somehow the swiper unable to to listen to any event change like “slideChange”. What is the issue?

<swiper-container [modules]="swiperModules" [direction]="'vertical'" [pagination]="swiperPagination" [virtual]="swiperVirtual" (slideChange)="onSlideChange()" #swiperRef >
    <swiper-slide *ngFor="let item of slides">Slide {{item}}</swiper-slide>
</swiper-container>

I already follow the migration section in ionic framework to setup for the swiper 11.0.3 with standalone app.

1 Like
2

SOLVED
I had the same issue, but as you can also see here Swiper Element (WebComponent) you have to use the (swiperslidechange) event not (slidechange), so:

From this:

<swiper-container [modules]="swiperModules" [direction]="'vertical'" [pagination]="swiperPagination" [virtual]="swiperVirtual" (slideChange)="onSlideChange()" #swiperRef >
    <swiper-slide *ngFor="let item of slides">Slide {{item}}</swiper-slide>
</swiper-container>

To this:

<swiper-container [modules]="swiperModules" [direction]="'vertical'" [pagination]="swiperPagination" [virtual]="swiperVirtual" (swiperslidechange)="onSlideChange()" #swiperRef >
    <swiper-slide *ngFor="let item of slides">Slide {{item}}</swiper-slide>
</swiper-container>
4 Likes
3

very good , it work for me!!!

4

[virtual] is not working for me when I use ngFor to render swiper-slides, can you tell me what have you used in swiperVirtual