AngularJS中window.onbeforeunload对等路由的等价性

Question

常规JavaScript有window.onbeforeunload.如何使用HTML5路由在AngularJS中模拟相同的内容？

有$ beforeRouteChange,但它不允许你取消事件,据我所知.

澄清一下:window.onbeforeunload可用于导航离开页面,但不适用于页面内导航,例如仅通过HTML5历史API从一个控制器转到另一个控制器.

Answer 1

添加这个:

$scope.$on('$destroy', function() {
   window.onbeforeunload = undefined;
});
$scope.$on('$locationChangeStart', function(event, next, current) {
   if(!confirm("Are you sure you want to leave this page?")) {
      event.preventDefault();
   }
});

Answer 2

有一个$locationChangeStart事件可以取消.

由于尚未记录,这里是单元测试,描述它如何影响$route服务. https://github.com/angular/angular.js/blob/v1.0.1/test/ng/routeSpec.js#L63

这并不像用户那样为用户提供确认window.onbeforeunload.您需要自带对话框服务并重新启动位置更改过程以获得相同的效果(或者您可以使用同步$window.confirm).

Answer 3

如果您使用的是angular-ui-router,则需要使用$stateChangeStart而不是$locationChangeStart.