单页应用（ng/vue）该如何监听用户离开当前页面（或者路由）？

Question

场景描述：在ng的某个路由中，需要在用户离开当前路由时提示用户是否确认离开

我的疑惑：如果是普通的应用，我们可以使用js来判断用户是否要离开，但是在单页应用中，所有的跳转离开其实都是在一个页面中，我想判断用户是否离开当前路由，但是没找到ng提供的公户离开路由的方法

求各位前辈的思路~

Answer 1

我只知道Vue可以

route: {
            deactivate() {
                ...
            }
        }

Answer 2

js原生通过hashchange事件，来监听页面hash是否变化，在单页面应用中，很多的框架都会封装这个方法成钩子函数。

Answer 3

ui-router里面有一个事件可以监控状态的改变，回调函数中参数可以记录当前页面
$rootScope.$on('$stateChangeStart', function (event, toState, fromState){
});

Answer 4

ng中如果使用ui-router来作为路由系统。可以使用ui-router的事件系统来对路由状态的变化做出相应的业务逻辑。

$rootScope.$on('$stateChangeStart',
function(event, toState, toParams, fromState, fromParams){
    event.preventDefault();
    // transitionTo() promise will be rejected with
    // a 'transition prevented' error
})

详情可以参考ui-router中的$state