Sagar Khan
Sagar Khan

Reputation: 302

Ionic Slides autoplay stop working when navigating back to the page

I am creating an ionic application in which i have added autoplay slider showing client's story in the apps home page. There are various cards in the home page clicking on which the user is navigated to those respective pages. Now when returning back to the home page the slider autoplay stops. Following is a basic snippet of my code.

<ion-slides autoplay="2000" loop="true" speed="3000" class="slides" pager="true">
    <ion-slide>
        <img src="assets/img/slide1.jpg">
    </ion-slide>
    <ion-slide>
        <img src="assets/img/slide2.jpg">
    </ion-slide>
    <ion-slide>
        <img src="assets/img/slide3.jpg">
    </ion-slide>
</ion-slides>

I have the tried inbuilt slider methods such as update() and startAutoplay() on the ionicViewDidEnter() function

ionViewDidEnter(){
    console.log("View Entered");
    this.slides.update(); // or this.slides.startAutoplay()
}

But none of them worked. A descriptive answer with code will be quite helpful for my understanding and future references. Thank you

Upvotes: 3

Views: 2548

Answers (1)

I was with the exactly same problem. And looking for a solution I found your question. Few minutes after I got a solution, may it help you.

on ionViewWillLeave(), stop the autoplay, then after, on ionViewDidEnter() start it again.

ionViewWillLeave()

 ionViewWillLeave(){
    this.slides.stopAutoplay();
  }

ionViewDidEnter()

  ionViewDidEnter() {
    this.slides.startAutoplay();
  }

Hope it help you.

Upvotes: 8

Related Questions