Options binding for ion-slides in Ionic 2

Ionic Framework ionic-v3
1

I cannot get the options for an component to bind in Ionic 2.

<ion-slides id='slider' pager autoplay="false" pager="false" options={{sliderOptions}}>

Then in the ts page behind:

    sliderOptions: any = {
        effect: 'cube',
        noSwiping: true,
        direction: 'vertical'
    };

I have tried many variations but just cannot get the options to actually work.

Anyone have any ideas as this isn’t documented anywhere on the Ionic docs?

2

instead do this →

<ion-slides id='slider' pager autoplay="false" pager="false" [options]="sliderOptions">

3

Ah damn, that’s perfect - thank you!. Still getting to grips with Angular 2.

4

Hi I am getting following error if i use initialSlide

“Cannot read property ‘activeIndex’ of undefined”

could you please get me out from this issue.

2 Likes
5

For me doesn’t work… Any help will be highly appreciated!! thanks!

[initialSlide]="initialSlide"

6

<ion-slides id='slider' pager autoplay="false" pager="false" options="{{sliderOptions}}">
does the same job.
:wink:

7

Just try this:
initialSlide="{{initialSlide}}"

8

No, doesn’t work! the syntax is correct, there is something else to it…

9

oops Let me check…

10

Can you show me your code ?

11

Sure, here it is. initialSlide get passed to the HTML ok, but the sliders doesn’t work.

    <ion-slides class="slides" pager="true" [initialSlide]="initialSlide">
      <ion-slide class="slider" *ngFor="let i of photosArray">
        <img (click)="removePhoto(i.id)" class="sliderPhoto" [src]="i.imageURI">
      </ion-slide>
  </ion-slides>