Ionic2-解决在使用slides的时候autoplay、loop等Input Properties报错问题

时间:2021-07-10 19:13:20

在我使用ionic提供的最新slides组件的时候,在使用autoplay等属性的时候

 <ion-slides autoplay="3000" loop=true pager=true > <ion-slide *ngFor="let slides_image of slides_images" > <img src="{{slides_image.image}}" alt="" > </ion-slide> </ion-slides>

遇到以下报错信息:

Runtime Error
    Cannot read property 'hasAttribute' of undefined

TypeError: Cannot read property 'hasAttribute' of undefined
    at autoplay (http://localhost:8100/build/main.js:45371:20)
    at startAutoplay (http://localhost:8100/build/main.js:45409:5)
    at initSwiper (http://localhost:8100/build/main.js:45362:9)
    at Slides._initSlides (http://localhost:8100/build/main.js:44207:102)
    at http://localhost:8100/build/main.js:44227:19

解决方法:
在使用ion-slides的时候加上*ngIf=”slides_images.length > 1”,判断其长度是否大于1即可。

 <ion-slides autoplay="3000" loop=true pager=true *ngIf="slides_images.length > 1"> <ion-slide *ngFor="let slides_image of slides_images" => <img src="{{slides_image.image}}" alt=""> </ion-slide> </ion-slides>

还有部分遇到在页面切换后autoplay失效的问题,只需要加上 autoplayDisableOnInteraction:false即可。