Ion-slides: events not firing


#1

I want to add events to the slides but the events aren’t firing at all.

I am using Ionic version 1.3.3

Here is my code:

<ion-slides options="options" slider="data.slider">
  <ion-slide-page ng-repeat="profile in home.profiles">
    <div class="card image">
      <div id="container-{{profile.$id}}"></div>
    </div>
    <div class="item">
      <h2>{{profile.displayName}}, {{profile.age}} (<i class="ion-heart"></i> {{profile.stars}})</h2>
    </div>
  </ion-slide-page>
</ion-slides>
app.controller('HomeCtrl', function (Auth, $ionicLoading, $scope, $ionicSlideBoxDelegate) {

  var home = this;

  $scope.options = {
    loop: false,
    speed: 800,
    pagination: false,
  };

  $scope.$on('$ionicSlides.sliderInitialized', function (event, data) {
    // data.slider is the instance of Swiper
    console.log('initialized');
    $scope.slider = data.slider;
  });

  $scope.$on('$ionicSlides.slideChangeStart', function (event, data) {
    console.log('Slide change is beginning');
  });

  $scope.$on('$ionicSlides.slideChangeEnd', function (event, data) {
    // note: the indexes are 0-based
    console.log('Slide change ended');
    $scope.activeIndex = data.slider.activeIndex;
    $scope.previousIndex = data.slider.previousIndex;
  });

});

#2

Check for console if there is any error. List the errors to help you out


#3

Nothing shows up in the console. The events just aren’t firing at all.


#4

refer

output events list to resolve the issue


#5

I’m using Ionic 1. Those don’t seem to work.


#6

I think you’re using the old version. Maybe you can try the new one https://ionicframework.com/docs/v1/api/directive/ionSlide/


#7

Ok, so using ion-slide-box the events are now working. Thanks! :slight_smile:

But I’m having problems using ng-repeat now. It doesn’t work at all. When I slide to the next item, it displays the first item, but when I slide to the next one it’s blank.


#8

any error in console.log? maybe something was wrong with the array you are using in ng-repeat…