<ion-slide> not work correctly in beta.10

Hi,

I have problem after update to ionic 2 beta.10 with .

After loading a page my slider doesn’t work correctly (show only 1 bullet point and slide don’t work), but after resizing page, bullets have a right number and slider work correctly.

Example GIF: http://g.recordit.co/5D2CzdZa1o.gif

Any idea?
I mean this is bug in beta.10.

thx.
tom.

I have exactly the same problem. (beta 10)

Thanks.
I think, I can create a issue in github repository.

It isn’t separated package already?

Hmm, interesting. How could I go about trying to recreate this?
Could you share some code?

1 Like

You can use the conference app, I tried here and it has the same problem.

with ionic serve when the emulator as iOS, works. As android not.

I came across a similar problem when porting my own slide implementation to Angular 2 RC3, which also uses Swiper.
The problem was that the swiper container has already been in the DOM but not rendered when I instantiated the Swiper code. Swiper’s calculations rely on the container’s width which is 0 when the container is not rendered.
My (hacky) solution was to use requestAnimationFrame() until the container’s width is >0 and instantiate Swiper after that.
With the past Angular 2 releases, the DOM elements have already been rendered when Angular calls ngOnInit or ngAfterViewInit. Apparently this has changed in the new version which might be a bug!?
Hope this helps although there might a better ‘more-angular’ solution…

Any solution? I have to publish tomorrow an App on Google Play, but if I can’t use the slides I need to rewrite a form page…
Thank you.

See the following repo for an example app containing a temporary fix:
https://github.com/GerritErpenstein/ionic2-slides-temp-fix/
You can find the relevant code in “app/pages/slides”.
I’m really curious whether somebody comes up with a better solution!

2 Likes

Thank you for your suggestion. But I rewrote the form to use only a page at the moment (without slides). I hope Ionic team fixes this issue to back to slide (for a form registration)

Same problem for me with the swiper not initializing properly on AppInit and only after manually reinitializing it. Your solution worked flawlessly, though! Thank you very much for providing the code.

I’m Also having exactly the same problem. Works on iOS but not on android…

Hey all I submitted the issue https://github.com/driftyco/ionic/issues/7347

Thanks Gerrit, your solution is working perfectly whilst we are still waiting for Beta11 to be released.

Thank you man. You saved my app intro :slight_smile:

Thanks @Gerrit it, saves my life :slight_smile: love you