Ionic 3 slide not working with autoplay

user_7769369 0
Viewed 10318

I am using ionic 3.

Here is my template

 <ion-slides autoplay="5000" loop="true" speed="500" class="slides" pager="true">
      <ion-slide *ngFor="let Image of PImage">
         <img src="{{Image.URL}}" alt="Product Image">
      </ion-slide>
 </ion-slides>

But I am getting this error

TypeError: Cannot read property 'hasAttribute' of undefined

How can I fix this issue?

Kindly advice me,

Thanks

ionic2 ionic3 ionic-framework angular typescript
2 Answers

If anyone use Ionic 4, then try this method:

HTML:

  <ion-slides #mySlider (ionSlidesDidLoad)="slidesDidLoad()" autoplay="5000" loop="true" speed="500" class="slides" pager="true" [options]="slideOpts">
    <ion-slide *ngFor="let adsImages of AdsImages">
      <img src="{{adsImages}}">
    </ion-slide>
  </ion-slides>

TS:

  AdsImages = [
    "../../assets/images/ads-sample.webp",
    "../../assets/images/ads-sample2.webp",
    "../../assets/images/ads-sample3.webp"
  ];

  slideOpts = {
    zoom: false
  };

  @ViewChild("mySlider") slides: IonSlides;

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

SCSS:

ion-slides {
  --bullet-background: #ffffff;
  --bullet-background-active: #b8b8b8;
}

Fore more information: https://ionicframework.com/docs/api/slides

user_74010540
Related