无法阻止角度应用程序中的浏览器页面刷新/重新加载

时间:2015-12-22 11:16:29

标签: javascript angularjs

我的网站有angularjs SPA。当用户点击刷新按钮或按F5 / Ctrl + F5我要阻止或中止页面重新加载时。很遗憾,onbeforeunloadonunload事件的解决方案无效。实际上,它们被调用,到达event.preventDefault()行,控制台中有任何消息,但浏览器继续加载页面。

我当前的模块.run()代码:

let window = angular.element($window);
window.on("beforeunload", (event) => {
    event.preventDefault();
}).on("unload", (event) => {
    event.preventDefault();
});

// This is just for sure that I have my handlers registered 
$window.onbeforeunload = (event) => {
    event.preventDefault();
}

$window.onunload = (event) => {
    event.preventDefault();
}

我怎样才能真正处理角度?

更新

我需要这个来重新加载实际状态而不是页面。因此,当用户点击刷新时我想用$stateProvider重新加载当前状态而不是重新加载整个页面

1 个答案:

答案 0 :(得分:10)

查看Mozilla has to say about unload events。看起来似乎无法阻止您想要的刷新。唯一认为你能做的就是询问用户他/她是否真的要离开页面。

我猜你可以在用户回答他/她不想离开当前页面的情况下重新加载当前状态。

window.onbeforeunload = function(event) {
    // do some stuff here, like reloading your current state
    //this would work only if the user chooses not to leave the page
    return 'why would you do that???';
}

我创建了一个fiddle for you