devmark / angular-slick-carousel

Angular directive for slick-carousel
http://devmark.github.io/angular-slick-carousel/
MIT License
353 stars 125 forks source link

Carousel not destroying properly when settings object is updated. #113

Open decodedcreative opened 7 years ago

decodedcreative commented 7 years ago

Hi,

There however seems to be a bug with the plugin where its destroy method does not properly remove slides from the carousel instance.

angular-slick.js has the following Angular Watch which is triggered every time a change is made to the settings object:

return scope.$watch('settings', function (newVal, oldVal) { if (newVal !== null) { return destroyAndInit(); } }, true);

My carousel initially loads with 15 slides and every time the destroyAndInit function is run, another 15 slides are erroneously added to the carousel. Because of this I suspect the destroy function is not working as expected. Here is the code for it:

` destroy = function () {

    var slickness = angular.element(element);
    if (slickness.hasClass('slick-initialized')) {
      slickness.remove('slick-list');
      slickness.slick('unslick');
    }

    return slickness;
  };`

Any ideas?

ericjames commented 7 years ago

the selector is a class so it should be slickness.remove('.slick-list');

ein-bandit commented 6 years ago

Furthermore the jQuery Event handlers are not removed. So after destroying and (re-)init handlers get called twice. is there a slickness.off() jQuery call to remove handlers missing?