Prepend slides to ion-slides

Hi,

I’m trying to prepend a couple of slides to my current slide. However this results in a popping to the new slide. I suspect this comes from the fact that the current slide is for example at index 0 in the array and appending 2 items would cause the current slide to be at index 2 but it would still show the slide at index 0. I would like this to become index 2 without any flickering or crazy timeouts.

At the moment i’ve tried moving the slide to a new index (this.slides.slideTo(newIndex, 0) but this does nothing unless i put a timeout of 1s around it (which makes it pop first and then got to the right slide)

If anyone has any ideas that would be great,

With best regards,
Robin

Hi,

A very interesting use-case, and, from what I understand, you are close to the answer yourself. In a recent article, I wrote how such mechanism you describe is implemented.

The main takeaways from that article are;

  • the Sliders component is initialized asynchronous; a setTimeout() seems the solution, but as you have experienced yourself it isn’t. The article describes how to work around this.
  • appending data (recreating the Slides) needs to happen within the “right” events to work properly.

If the article doesn’t provide pointers that helps you, you can always copy / paste a code snippet that gives us more context.

1 Like