angularjs - Initializing fullpage.js multiple times in an angular app -


i building angular app uses fullpage.js in few of pages. currently, initializing fullpage (e.g. $('#this-routes-fullpage').fullpage({ options... }) ) using custom directive within template each route getting used. @ end of each of these custom directives, i'm calling

scope.$on('$routechangestart', function() {     $.fn.fullpage.destroy('all'); } 

this works expect (the plugin destroyed , reinitialized next time encountered) when navigating 1 page utilizes plugin, page doesn't utilize it, , on third page utilize it. however, if intermediate step left out , navigate directly 1 route utilizes fullpage second utilizes it, plugin doesn't initialize properly. mean controls won't work.

this makes me think there better place me call destroy function take proper advantage of angular events. can me out this?? thanks!

just destroy whenever , wherever initialize it. before initialization, example:

//destroying if (typeof $.fn.fullpage.destroy == 'function') {      $.fn.fullpage.destroy('all'); }  //initializing  $('#fullpage').fullpage(); 

or can check if initialized before checking class/flag fullpage.js adds html element (supposing doesn't modified in ajax calls).

//destroying if($('html').hasclass('fp-enabled')){     $.fn.fullpage.destroy('all'); }  //initializing   $('#fullpage').fullpage(); 

update

a few angular directives available:


Comments

Popular posts from this blog

c++ - Difference between pre and post decrement in recursive function argument -

php - Nothing but 'run(); ' when browsing to my local project, how do I fix this? -

php - How can I echo out this array? -