CODEWITHSUNDEEP
jqueryangularjs
under5hell
under5hell

Reputation: 997

Detect current slide and trigger a function based on that in ANgularJS

I have a slider jquery plugin that rotate some images in timer. Its a minified version so i can't read the source. What i wanted to do is everytime the slide change, i want to automatically update an angular model. that model therefore will update some content on the page. How can i make angular track the change triggered by jquery?

Upvotes: 1

Views: 132

Answers (1)

Nagy Nick
Nagy Nick

Reputation: 755

Your Slider probably has some kind of documentation, check that out and look for anything about events. ( jQuery sliders usually broadcast an event on the slider element when things happen - slide change for example )

Then in your code set a listener on your slider event that get's triggered by the event. Inside that listeners callback, change the model, and call $scope.$apply(); if needed.

Example with slickslider:

$('.your-element').on('beforeChange', function(event, slick, currentSlide, nextSlide){
  yourModel = nextSlide;
});

where:

$('.your-element') is a selecting the slider element

beforeChange is an event that the plugin broadcasts right before it changes the current slide

Upvotes: 1

Related Questions