ionic 中使用 slidebox 利用angular ng-repeat 渲染后不显示问题

在使用ionic slidebox指令做图片轮播显示的时候，发现一个问题，ng-repeat遍历生成一个个slide块的时候，执行完成页面是空白的。

方法：1
ng-repeat的数据是延迟加载过来的。当 img 没有渲染结束是不能工作的，你这样改一下：

<ion-slide-box ng-if="slideimgs" on-slide-changed="slideHasChanged($index)"  class="slidebox"  auto-play="true" slide-interval="4000" delegate-handle="slideimgs" does-continue="true">

<ion-slide ng-repeat="imginfo  in  slideimgs">

...

</ion-slide>

</ion-slide-box>

在ion-slide-box 加上  ng-if = “repeat value”


方法2：

要手动在渲染之后更新一下，在控制器注入$ionicSlideBoxDelegate，然后渲染数据之后，添加$ionicSlideBoxDelegate.update()；

.controller('MyPhotosCtrl', function ($scope, $ionicSlideBoxDelegate) {  

$scope.photos= [ ... ]   

$ionicSlideBoxDelegate.update();

})

<slide-box show-pager="false" on-slide-changed="onSlideChanged(index)" active-slide="currentIndex">       

<slide ng-repeat="photo in photos">           

     <img ng-src="{{ photo.ThumbnailURL }}" />      

  </slide>

</slide-box>

问题链接：


https://forum.ionicframework.com/t/slides-generated-with-ng-repeat-causing-issues-slide-box/394/6


http://ionichina.com/topic/55056b24a6a368202ec81659