Multiple slider issue rc.5

[CooleyGit]

Ionic version: (check one with "x") [ ] 1.x [x ] 2.x

I'm submitting a ... (check one with "x") [x ] bug report [ ] feature request [ ] support request => Please do not submit support requests here, use one of these channels: https://forum.ionicframework.com/ or http://ionicworldwide.herokuapp.com/

Current behavior:

I recently updated my app to RC.5 and converted my sliders to use the new pattern. Everything seems to work fine on iPhone after building but browser preview from serve has issues. Slider on main page works fine but slider on page two wont complete a swipe and when it does it seems to be changing slider on page one. I built a clean app and added two sliders in one page to see if it was something in my app but same results.

Expected behavior:

Multiple sliders in an app that work independent.

Steps to reproduce:

Put two sliders in a page or in an app second one fails. http://plnkr.co/edit/vT2FZA?p=preview

Related code:

@ViewChild('sliderOne') sliderOne: Slides;
  @ViewChild('sliderTwo') sliderTwo: Slides;

  <ion-slides #slideOne>
    <ion-slide>
      <h1>Slider One 1</h1>
    </ion-slide>
    <ion-slide>
      <h1>Slider One 2</h1>
    </ion-slide>
    <ion-slide>
      <h1>Slider One 3</h1>
    </ion-slide>
  </ion-slides>

  <ion-slides #slideTwo>
    <ion-slide>
      <h1>Slider Two 1</h1>
    </ion-slide>
    <ion-slide>
      <h1>Slider Two 2</h1>
    </ion-slide>
    <ion-slide>
      <h1>Slider Two 2</h1>
    </ion-slide>
  </ion-slides>

Other information:

Ionic info: (run ionic info from a terminal/cmd prompt and paste output below):

Cordova CLI: 6.4.0 
Ionic Framework Version: 2.0.0-rc.5-201701131937
Ionic CLI Version: 2.2.1
Ionic App Lib Version: 2.2.0
Ionic App Scripts Version: 1.0.0
ios-deploy version: 1.8.6 
ios-sim version: 5.0.13 
OS: macOS Sierra
Node Version: v6.9.2
Xcode version: Xcode 8.0 Build version 8A218a

[apetushkov]

Same here. If i have more than 1 ion-slides, only first is operable

[SkogDev]

I'm having the same problem. First I thought it was related to having multiple sliders in the same view, but after moving the second slider to another view (and .ts), I realized the problem still exists.

I am able to control the first slider using the "sliderOne"-object, with functions like "lockSwipes" and "slideNext". This is not working on the "sliderTwo"-object.

[hitpopdimestop]

Have anyone managed how to make it work? I'm also having 2 Slides elements in 1 page and right now trying to refactor the code from RC4 to 2.0.0. At first I thought it would be a piece of cake but now I see it's not that easy. Can anyone share an example of working code?

[MarkChrisLevy]

I tried to digg into the slides source code to trace the issue, but no luck - the code is pretty complex and it requires deeper knowledge about the structure, logic and relation between slides and swiper. @brandyscarney Any chance that someone from ion-slides contributors can check this issue? It is present in 2.0 final as well and makes using multiple slides impossible.

[Corvi2]

Can anyone please confirm this is only a bug in browser, but not in an actual app? Unfortunately I can't test this right now, but multiple sliders per view is essential for my app. :(

[CooleyGit]

Im using multiple sliders in my app but not the same view. This fails in the browser preview but works fine in ios app on the device or simulator. Ive tested my app deployed directly from Xcode and through iTunes Connect but I have not tested android.

The only workaround I currently have is turning off sliders im not working on during dev then turning them back on when I build, kinda a pain but keeps the code moving...

[andre-huehn]

We have the same problem: Scenario: 4 Tabs, each with a Swiper in it

Problem seems to be, that the mousemove, mousedown events are registered for each Swiper on the Browser Document, but never are deregistered, so when i start moving e.g. Swiper-2 the mouseup event on the Document is firing and is moving Swiper-1 instead of Swiper-2. This is a blocking issue for us. This only does not work in browser mode when simulateTouch is true. Is there a fix on the roadmap? We are happy to give you more context on this.

[OcelynZizo]

Same problem here with 2 Tabs, each with a Slider in

[ionitron-bot[bot]]

Thanks for the issue! This issue is being closed due to inactivity. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.

Thank you for using Ionic!