PhoneGap中文网

 找回密码
 立即注册
查看: 18524|回复: 1
打印 上一主题 下一主题

ionic ion-slide-box ng-repeat动态更新以及我会更新后不自动循环...

[复制链接]

493

主题

2035

帖子

6894

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
6894
跳转到指定楼层
楼主
发表于 2016-2-3 16:22:16 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

1.ionic ion-slide-box调用远程数据 ng-repeat循环显示数据

模板:
  1.   <ion-slide-box delegate-handle="slideimgs" show-pager="true" auto-play="true" does-continue="true">
  2.                 <ion-slide  ng-repeat="focus in focuslListData">
  3.                     <a href="#/product_content/{{focus.url}}"><img ng-src="{{ENV.imgUrl}}{{focus.img}}"></a>
  4.                 </ion-slide>
  5.             </ion-slide-box>
复制代码

后台请求数据:

  1.   FocusListFactory.fetchFocusList();
  2.         $scope.$on('Focus.ListUpdated', function(event,data) {
  3.             $scope.focuslListData=FocusListFactory.getFocusList();
  4.             $ionicSlideBoxDelegate.update();  //更新ionic SlideBox
  5.             $ionicSlideBoxDelegate.$getByHandle("slideimgs").loop(true);
  6.         });
复制代码



这里一定要注意两个事情:

1.循环完成数据后使用
$ionicSlideBoxDelegate 然后执行下面方法更新我们的幻灯片 不然会出问题
  1. $ionicSlideBoxDelegate.update();  //更新ionic SlideBox
复制代码

2.我们会发现调用update虽然正常了,但是
slidebox就会出现不能循环滚动,就是滚动到最后一张不会在从头开始,does-continue="true"没有生效,是怎么回事,怎么解决这个问题,是bug吗?
解决办法就是上面代码  ,加上这么一句话搞定

  1. $ionicSlideBoxDelegate.$getByHandle("slideimgs").loop(true);
复制代码



具体的指令什么意思 怎么用可以参考下面文档

http://www.ionic.wang/js_doc-index-id-44.html



回复

使用道具 举报

2

主题

14

帖子

108

积分

注册会员

Rank: 2

积分
108
沙发
发表于 2016-2-4 22:32:04 | 只看该作者
怎么解决高度问题呢,比如两个列表长度不同,但是在slide-box里面两个高度都相同,体验很不好
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关闭

站长推荐 上一条 /1 下一条

ionic4视频教程

Archiver|手机版|小黑屋| PhoneGap中文网 ( 京ICP备13027796号-1 )  

GMT+8, 2024-4-25 18:32 , Processed in 0.037047 second(s), 30 queries .

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表