activeIndex() in slides Not working

[im-bhatman]

Ionic version: 2.x

I'm submitting a ... bug report

Current behavior:

using slider.getActiveIndex() gives this error:

Error in ./Images class Images - caused by: Cannot read property 'activeIndex' of undefined

Expected behavior:

Without this bug i'll be able to get the activeIndex of the active slide out of many different slides available to us in the array.

Related code:

in html file
<ion-slides #mySlider [options]="mySlideOptions" (ionDidChange)="onSlideChange()" >
        <ion-slide *ngFor="let obj1 of objectList">
            <img src="{{obj1.path}}">
            <p>{{ "HOME.ID" | translate }}</p >
        </ion-slide>
    </ion-slides> 

in ts file

@ViewChild('mySlider') slider:  Slides;

onSlideChanged() {
       this.currentIndex = this.slider.getActiveIndex() - 1;
        if (this.currentIndex < 0)
            this.currentIndex += 10;
        this.objectIndex = this.currentIndex;
    }

Error in ./Images class Images - caused by: Cannot read property 'activeIndex' of undefined Another error is: EXCEPTION: Cannot read property 'update' of undefined

i aslo posted this in ionic forum but didnt received any proper response so therefore opened an issue here...can anyone please help me out of this..Thanks in advance

[cozzbie]

Try

`<ion-slides #mySlider [options]="mySlideOptions" (ionDidChange)="onSlideChanged(mySlider)" ><ion-slide *ngFor="let obj1 of objectList">

        <p>{{ "HOME.ID" | translate }}</p >
    </ion-slide>
</ion-slides>`

onSlideChanged(slider) { this.currentIndex = slider.getActiveIndex() - 1; if (this.currentIndex < 0) this.currentIndex += 10; this.objectIndex = this.currentIndex; }

instead.

[im-bhatman]

Sorry still not working.. Also another error is there .. EXCEPTION: Cannot read property 'update' of undefined

[rapropos]

I don't think this is a bug. You're relying on the slider being fully constructed before it actually is.

[jgw96]

Hello @forriteshbhat , thanks for opening an issue with us! Would you mind using this plunkr to create an example of the issue you are seeing please?

[mhartington]

@forriteshbhat I'm unable to replicate this

http://plnkr.co/edit/4zJh8OmUIqOKsgMflXEx?p=preview

Could you test this?

[im-bhatman]

@mhartington I ran the code again...the issue is coming because of mySlideOptions. When i am removing the [options] from ion-slides ...it is working fine..but i have to use initialSlide property(of mySlideOptions)..

when i am using [options] the it is showing thses errors... error_handler.js:47 EXCEPTION: Error in ./Images class Images - inline template:28:4 caused by: Cannot read property 'activeIndex' of undefined

EXCEPTION: Cannot read property 'update' of undefined

On plunker it is working fine..but when i implement [options] then it is again showing error..

it is showing error if we try to implement [options] as below... in .ts file

constructor(){
    this.mySlideOptions = {
            initialSlide: 1,
            loop: false,
        };
  }

and in html

<ion-slides #mySlider [options]="mySlideOptions" (ionDidChange)="onSlideChange()">
    <ion-slide *ngFor="let slide of slides">
      <pre>{{slide |json}}</pre>
    </ion-slide>
  </ion-slides>

can you suggest anything now..?

[mhartington]

Hmmm, alright, it seems the issue is related to the ionDidChange event and initialSlide key for the options. Seems that when the slide index has been updated, the didChange event will fire, but before the DOM is ready, causing an error. There's been some refactoring of slides internally so I'll test out the latest bits and get back to you.

[im-bhatman]

Thanks mike...hope to see the solutions soon

[yanxiaodi]

I have the same problem. I want to use "try-catch" to catch the exception and avoid the crash. But the slider can't navigate with the try-catch code. I don't know why. Wish to fix it as soon. Thanks!

[gmooren]

I faced the same issue. You can temporarily prevent the error by checking if slider can return a swiper instance.

public onSlideChanged() {
    if (this.slider.getSlider()) {
       // do some stuff here
    }
}

[mhartington]

This has been fixed in the nightly build with the slides refactor!

Closing.

[im-bhatman]

Thanks a lot..!!

[ionitron-bot[bot]]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. 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.