Slides generated with ng-repeat causing issues (slide-box)

ionic-v1
63

ng-if do the trick! Thanks!

My example:

  <ion-slide-box
    does-continue = "true"
    auto-play         = "true"
    ng-if                 = "sliders">

    <ion-slide
      ng-repeat   = "slide in sliders"
      style           = "overflow:hidden;position:relative;height:300px">

      <img
        style       = "position:absolute;margin:auto;left:-50%;right:-50%;top:0;bottom:0"
        ng-src    = "{{'http://www.dummy.ccc/images/' + slide.medio}}">

    </ion-slide>
  </ion-slide-box>
64

I achieved to resolve this trouble using the ionic-image-lazy-load library:

JS:

.controller('myCtrl', function ($scope) {
   $scope.images = imagesArray(); // Get array of objects with image urls
   $scope.slider = {
   options: {
    direction: 'horizontal',
    slidesPerView: '1',
    grabCursor: true
   }
  };
});

View:

<ion-content lazy-scroll>
   <ion-slide-box style="width:100% !important">
      <ion-slide ng-repeat="slide in images">
         <img image-lazy-src="{{slide.url}}" lazy-scroll-resize="true" image-lazy-loader="lines" style="width:100%">
      </ion-slide>
   </ion-slide-box>
</ion-content>
65

ng-repeat also generates a bug with $ionicSlideBoxDelegate.next() & $ionicSlideBoxDelegate.previous().

my solution:

<ion-slide-box show-pager="false" delegate-handle="myhandle" does-continue="true" ng-if="arrayWithData.length">

and

$scope.moveSlider = function(dir){
        var current = $ionicSlideBoxDelegate.$getByHandle('myhandle').currentIndex();
        var count = $ionicSlideBoxDelegate.$getByHandle('myhandle').slidesCount();
        
        if(dir == 'left'){
            if(current == 0){
               $ionicSlideBoxDelegate.$getByHandle('myhandle').slide(count - 1); 
            }else{
                $ionicSlideBoxDelegate.$getByHandle('myhandle').slide(current - 1)
            }
        }else{
            if(current + 1 == count){
               $ionicSlideBoxDelegate.$getByHandle('myhandle').slide(0); 
            }else{
                $ionicSlideBoxDelegate.$getByHandle('myhandle').slide(current + 1)
            }
        }
    }
66

Working great with your tip! simple and fast solution… thx, saved my day!

67

Great!:slight_smile:

68

Thank you so much… U saved my day :slight_smile:

69

This working perfectly

70

Thanks a lot windht .:relieved:

71

Worked very well. Thanks a lot.

72

Bless you. $ionicSlideBoxDelegate.update() solves the problem without TIMEOUT

73

Excellent Tip. Thanks you saved my day.

74

you saved my time ! many thanks