How to access ons-carousel variable in Angular Controller?

Question

I would like to bind an eventhandler to my ons-carousel postchange event in my AngularJS controller, however I keep getting an Uncaught TypeError: Cannot read property 'on' of undefined.

I try to access my carousel through its var attribute from my controller:

$scope.myCarousel.on('postchange', function() {
  // do something
});

and my carousel is declared in my view:

<ons-carousel var="myCarousel" swipeable overscrollable auto-scroll>
...
</ons-carousel>

It works, however i can't access the variable myCarousel and can't bind the event to it. What am I doing wrong?

Answer 1

I searched a bit the documentation of ons-carousel and I could overcome this issue by adding ons-postchange="changeCurrentPictureIndex()" attribute to my carousel in the view and somehow inside my changeCurrentPictureIndex method I was able to access the myCarousel variable.