Strange sliding using ngFor in ion-slide


#1

Hi,

In my Ionic2 TypeScript project, I have a simple ion-slides implementation where slides are added from an array: <ion-slide *ngFor="#slide of slides">. In addition to these dynamically generated slides, I add a static slide <ion-slide (click)="addSlide()"> which allows the user to add a slide when tapping the slide (pushes an item to the slides array). All wrapped in <ion-slides id="slider" pager loop="true" autoplay="true">.

Interestingly, when I tap to add, the slide is added and shown (I guess due to the index not being changed) which is nice. When I slide to the right it shows the “addSlide slide” and when I slide to right it shows the addSlide again. When I slide again to the right, there is no real sliding but some sort of popping of the first slide (loop=true). This showing of the addSlide twice and the popping seems a bit odd and undesireable to me.

Anyone recognises this? Is this Ionic2 or something I do wrong configuring Swiper.js?

Regards

Tom


#2

Hi,

And to add to my misery, I added a button to the slide page to open a modal and after the dismiss of the modal, the slide content of the dynamically added slides is gone…

Regards

Tom


#3

Hi,

The sliding issue is resolved using beta-1. The modal (e.g. Alert) will cause the array to empty (page will leave and probably destroys the page) - explaining my other thing. Interestingly, this does not cause the number of slides dynamically added to turn into zero (leaving only the static slide display). So the pager shows the number of pages added before the modal was presented. This still seems odd to me.

Regards,

Tom