Problem with 2 ion-slide-box on the same page


#1

Hi, we have 2 ion-slide-box on the same page. When we go to the next slide with: $ionicSlideBoxDelegate.next(); both the 2 ion-slide-box slide to the next page. Is there a way to give the ion-slide-box an ID? and then $ionicSlideBoxDelegate.next(ID); Or something like that?


#2

You need to make use of the delegate-handle attribute.

<ion-slide-box delegate-handle="slidebox1">

Then you can reference the slide-box like so

$ionicSlideBoxDelegate.$getByHandle('slidebox1').next();

How can I have two slide-boxes at the same page?
#3

Thank you very much :grinning:


#4

where to put handle in this function ?

 $scope.slideChanged = function(index) {
       $scope.slideIndex = index;
 };

#5
<ion-slide-box delegate-handle="slidebox1"  on-slide-changed="slideHasChanged($index, 'slidebox1')">

Just pass the delegate name as a parameter to the on-slide-changed function.

 $scope.slideChanged = function(index, delegate) {
       $scope.slideIndex = index;
 };

#6

Thanks!! U saved my life!


#7

You just SAVED my time. :slight_smile: