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

在我使用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即可。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值