|
1.ionic ion-slide-box调用远程数据 ng-repeat循环显示数据
模板:
- <ion-slide-box delegate-handle="slideimgs" show-pager="true" auto-play="true" does-continue="true">
- <ion-slide ng-repeat="focus in focuslListData">
- <a href="#/product_content/{{focus.url}}"><img ng-src="{{ENV.imgUrl}}{{focus.img}}"></a>
- </ion-slide>
- </ion-slide-box>
复制代码
后台请求数据:
- FocusListFactory.fetchFocusList();
- $scope.$on('Focus.ListUpdated', function(event,data) {
- $scope.focuslListData=FocusListFactory.getFocusList();
- $ionicSlideBoxDelegate.update(); //更新ionic SlideBox
- $ionicSlideBoxDelegate.$getByHandle("slideimgs").loop(true);
- });
复制代码
这里一定要注意两个事情:
1.循环完成数据后使用$ionicSlideBoxDelegate 然后执行下面方法更新我们的幻灯片 不然会出问题
- $ionicSlideBoxDelegate.update(); //更新ionic SlideBox
复制代码
2.我们会发现调用update虽然正常了,但是slidebox就会出现不能循环滚动,就是滚动到最后一张不会在从头开始,does-continue="true"没有生效,是怎么回事,怎么解决这个问题,是bug吗?
解决办法就是上面代码 ,加上这么一句话搞定
- $ionicSlideBoxDelegate.$getByHandle("slideimgs").loop(true);
复制代码
具体的指令什么意思 怎么用可以参考下面文档
http://www.ionic.wang/js_doc-index-id-44.html
|
|