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

Question

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?

Nagy Nick · Accepted Answer · 2015-06-29 11:07:04Z

1

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

answered Jun 29, 2015 at 11:07

Nagy Nick

7559 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

under5hell Over a year ago

You right. FInally I found the docs on the internet. Thanks :)

Collectives™ on Stack Overflow

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

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related