ion-slides clobbers class attribute

[wli]

Short description of the problem:

When upgrading from beta4 to beta6, the ion-slides component clobbers any class set on the component.

What behavior are you expecting?

It should add to the classes instead.

Steps to reproduce:

1. Create an <ion-slides> component with a class attached
2. Observe the class not applying.

In the template:

<ion-slides class="foobar">

Reality:

<ion-slides class="slides-0">

Which Ionic Version? 1.x or 2.x 2.0.0-beta.6 (This used to work in 2.0.0-beta.4)

Plunker that shows an example of your issue

http://plnkr.co/edit/ZKFyjTiPG5M1lnEw5CPW?p=preview

Run ionic info from terminal/cmd prompt: (paste output below) Cordova CLI: 6.0.0 Ionic Framework Version: 2.0.0-beta.6 Ionic CLI Version: 2.0.0-beta.24 Ionic App Lib Version: 2.0.0-beta.14 OS: Distributor ID: Ubuntu Description: Ubuntu 15.10 Node Version: v5.8.0

[wli]

Looks like this is the relevant line: https://github.com/driftyco/ionic/blob/2.0/ionic/components/slides/slides.ts#L197

It used to be '[id]': 'slideId', but was changed to '[class]': 'slideId' in https://github.com/driftyco/ionic/commit/46544047be17dbbb117b50cc5e9694fd1ecf5bbd

I think the solution is just to remove the '[class]': 'slideId' line, since it doesn't seem used for anything. I checked and there is no CSS being applied to it.

[adamdbradley]

I think that's fair to just have it removed. Any objections?

@brandyscarney thoughts?

[brandyscarney]

@adamdbradley It is there to make the pagination unique. It is necessary for multiple slides in one app to work, otherwise they all will use the same pagination. If it gets removed then you'll have to find another way to pass the pagination uniquely.

[louisgv]

@brandyscarney Can you provide a sample of how to have multiple slides in one single page? I'm having trouble generating slides using ng-repeat:

  <ion-slides options="mainCtrl.slideOptions" slider="mainCtrl.slider" ng-repeat="item in mainCtrl.item">
      <ion-slide-page>
         {{item.name}}
      </ion-slide-page>
      <ionic-slide-page>
        Something Else
      </ionic-slide-page>

    </ion-slides>

[brandyscarney]

Hey @louisgv, it looks like you are using Ionic v1. This issue is more for v2. :smile: I recommend taking a look at the docs for v1: http://ionicframework.com/docs/api/directive/ionSlideBox/

or checking our forums: https://forum.ionicframework.com/

[brandyscarney]

This will be fixed in the beta.7 release. Thanks for the issue!