angularjs – 在角度应用程序中多次初始化fullpage.js

发布时间：2020-12-17 06:54:37 所属栏目：安全来源：网络整理

导读：我正在构建一个在其几个页面中使用fullpage.js的Angular应用程序.目前,我正在初始化整页(例如$(‘this-routes-fullpage’).fullpage({options …}))在模板中为每个使用它的路由使用自定义指令.在每个自定义指令的最后,我正在打电话 scope.$on('$routeChangeS

我正在构建一个在其几个页面中使用fullpage.js的Angular应用程序.目前,我正在初始化整页(例如$(‘this-routes-fullpage’).fullpage({options …}))在模板中为每个使用它的路由使用自定义指令.在每个自定义指令的最后,我正在打电话

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

当我从一个利用插件的页面导航到另一个不使用它的页面时,这正如我所期望的那样(插件在下次遇到时被销毁并重新初始化),然后返回到第三页确实利用它.但是,如果省略该中间步骤并且我直接从一个利用fullpage的路由导航到也利用它的第二个路径,则该插件不会正确初始化.我的意思是控件不起作用.

这让我觉得有一个更好的地方让我调用将充分利用Angular事件的destroy函数.任何人都可以帮我解决这个问题吗？谢谢！

解决方法

更新：

现在你可以使用the official Angular component for fullPage.js了.

只要在初始化时随时随地销毁它.就在初始化之前,例如：

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

//initializing 
$('#fullpage').fullpage();

或者您可以在检查fullPage.js添加到您的html元素的类/标志之前检查它是否已初始化(假设您的ajax调用中未对此进行修改).

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

//initializing 
 $('#fullpage').fullpage();

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!