ionic 1 ion-slide-box 的 does-continue 属性无法正常进行loop

来源：

乐只君子

2016-08-27

ion-slide-box 的 does-continue 是不是有问题？只有偶尔能用

做了一个banner，bannerList从后台API取到 imgUrl 与 linkUrl的对象数组

然后用ng-repeat生成ion-slide

再然后用$ionicSlideBoxDelegate.update()初始化组件

但总是无法正常loop，停留在最后一张

html:

<ion-slide-box class="banners" does-continue="true" auto-play="true">
      <ion-slide ng-repeat="banner in bannerList">
        <a href="{{banner.linkUrl}}">
          <img ng-src="{{banner.imgUrl}}" />
        </a>
      </ion-slide>
    </ion-slide-box>

controller:

$http.post(WX_SERVER_URL, {
      action: 'queryBannerList'
    })
    .then(
      function successCallback(res) {
        switch (res.data.status) {
          case 1:
            $scope.bannerList = res.data.bannerList;
            $ionicSlideBoxDelegate.update();
            break;
          default:
            console.log('unknow status');
        }
      },
      function errorCallback(res) {

      }
    );

res.data模拟数据

var data={
    "bannerList": [
        {
            "imgUrl": "http://oc3d2gkrr.bkt.clouddn.com/e98cb45794aa007952c1940243636313?e=1474226260&token=fYyrsLZ1UJ5Puwe3-0KvSzDEIfM1PVpPTiFqv29_:eUqlm2jdHE1wUBVmv-vpwTPwX7I=",
            "linkUrl": "http://m.jd.com"
        },
        {
            "imgUrl": "http://oc3d2gkrr.bkt.clouddn.com/569a7d0a22c39b52025edd2975135af2?e=1474226260&token=fYyrsLZ1UJ5Puwe3-0KvSzDEIfM1PVpPTiFqv29_:CHEvRTfrdsxIrPnh2eLUJ7abSAA=",
            "linkUrl": "http://m.jd.com"
        },
        {
            "imgUrl": "http://oc3d2gkrr.bkt.clouddn.com/727a085708e115210c9fb23bde0400c2?e=1474226260&token=fYyrsLZ1UJ5Puwe3-0KvSzDEIfM1PVpPTiFqv29_:-EHsl-9mE-ECj6O95AJIwSdNI5k=",
            "linkUrl": "http://m.jd.com"
        }
    ],
    "status": 1
}

写回答

2回答

Parry

2016-08-29

已采纳

请参见这里 https://github.com/driftyco/ionic/issues/1353

Parry

乐只君子

是否和取数据的函数执行时间有关？放在生命周期的函数里去执行呢？还是点击按钮后执行的，我看不到完整的逻辑。

2016-08-29

共2条回复

乐只君子

提问者

2016-08-27

res.data模拟数据

{
    "bannerList": [
        {
            "imgUrl": "http://oc3d2gkrr.bkt.clouddn.com/e98cb45794aa007952c1940243636313?e=1474226260&token=fYyrsLZ1UJ5Puwe3-0KvSzDEIfM1PVpPTiFqv29_:eUqlm2jdHE1wUBVmv-vpwTPwX7I=",
            "linkUrl": "http://m.jd.com"
        },
        {
            "imgUrl": "http://oc3d2gkrr.bkt.clouddn.com/569a7d0a22c39b52025edd2975135af2?e=1474226260&token=fYyrsLZ1UJ5Puwe3-0KvSzDEIfM1PVpPTiFqv29_:CHEvRTfrdsxIrPnh2eLUJ7abSAA=",
            "linkUrl": "http://m.jd.com"
        },
        {
            "imgUrl": "http://oc3d2gkrr.bkt.clouddn.com/727a085708e115210c9fb23bde0400c2?e=1474226260&token=fYyrsLZ1UJ5Puwe3-0KvSzDEIfM1PVpPTiFqv29_:-EHsl-9mE-ECj6O95AJIwSdNI5k=",
            "linkUrl": "http://m.jd.com"
        }
    ],
    "status": 1
}

Ionic飞速上手的跨平台App开发

以HTML5移动App开发框架Ionic，开发不受平台限制的App

1314 学习 · 640 问题

查看课程

相似问题

ion-slide该怎么自动轮播？

回答 1

执行ionic serve,报错无www/index.html

回答 4

ionic最新版（2.1.8）下如何根据id获取控件

回答 1

ionic start以后报错，

回答 3

ionic1 ion-slide-box ng-reperot(ng-src) 图片在手机端无法正常显示

回答 2

打开慕课网App查看更多内容