Options binding for ion-slides in Ionic 2


#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.


#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>