如何检测用户是否单击Angularjs中的浏览器后退按钮

Question

我有一个带有一些数据的表单页面.并且想要在用户单击浏览器后退按钮时显示弹出/警报,询问"他们是否想要返回或停留在同一页面上".我正在使用angular-ui-router,$stateProvider并希望将其仅绑定到一个状态/视图.

Answer 1

这是我之前对其他一些问题的回答,但应该对你有所帮助

你可以使用角度来做到这一点 $routeChangeStart

$ routeChangeStart

在路线改变之前广播.此时,路由服务开始解决路由更改发生所需的所有依赖关系.通常,这涉及获取视图模板以及解析路由属性中定义的任何依赖项.一旦解决了所有依赖关系,就会触发$ routeChangeSuccess.

$location通过调用preventDefault事件的方法可以防止路由更改(以及触发它的更改).$rootScope.Scope有关事件对象的详细信息,请参阅.

所以请尝试以下代码.

  $scope.$on('$routeChangeStart', function (scope, next, current) {
        if (next.$$route.controller != "Your Controller Name") {
            // Show here for your model, and do what you need**
            $("#yourModel").show();
        }
    });

更新:

您需要在模型弹出窗口中编写功能性工作.喜欢

放一些链接按钮

• 你确定要去上一页吗？
• 你想留下当前的页面吗？
• 你想退出吗？等等

然后为go prev page添加ng-click事件,使用return false等保留当前页面等.

会不会感觉到DUDE？

Answer 2

使用带角度ui路由器的$ stateChangeStart事件会更好.$ routeChangeStart会出现问题,因为当URL更改时会触发$ routeChangeStart事件.

例如:

您有4个状态,每个状态有2个子状态,并且每个子/状态或状态都不与URL关联.在这种情况下,监听$ routeChangeStart可能不起作用.

在控制器/视图中,您要提示用户确认重定向,请执行此操作.

当您的当前范围(您所在的视图/控制器)中的状态发生更改时,将调用此方法

$scope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams) {
    //Open the modal
    $('my-modal').show();
});