event.preventDefault()不适用于angularjs app中的routeChangeStart

iJa*_*ade 14 javascript routes angularjs angularjs-directive

希望任何angularjs大师都可以帮助我.这是我的angularjs代码

$scope.$on('$routeChangeStart', function(event, next, current) {
                if ($scope.myForm.$dirty) {
                    if(!confirm("Unsaved, do u want to continue?")) {
                        event.preventDefault();
                    }
                }
            });
Run Code Online (Sandbox Code Playgroud)

当数据变脏时,它会在浏览器后退按钮中发出警告,但是当点击取消或确定时它仍然完成路线更改.这样的话event.preventDefault()就不起作用了.任何人都可以指出可能出错的地方

Zor*_*lub 32

我很难找到这个,但是你可以听"$ locationChangeStart"事件而不是"$ routeChangeStart"事件,为此可以防止默认:

$scope.$on("$locationChangeStart", function(event, next, current) {
    if (!confirm("You have unsaved changes, continue navigating to " + next + " ?")) {
        event.preventDefault();
    }
});
Run Code Online (Sandbox Code Playgroud)

你也可以一直防止默认,存储"下一步",并显示一个干净的JS模态并异步决定.

$ locationChangeStart目前没有文档但在此引用:https://github.com/angular/angular.js/issues/2109


Roy*_*ron 5

完全修正了Angular 1.3.7 https://code.angularjs.org/1.3.7/docs/api/ngRoute/service/ $ route

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

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


F L*_*has 3

根据 AngularJS文档(参见 $broadcast),您根本无法取消广播类型的事件($routeChangeStart属于该类型):

事件生命周期从调用 $broadcast 的范围开始。所有在此范围内侦听 name 事件的侦听器都会收到通知。然后,该事件传播到当前作用域的所有直接和间接作用域,并一路调用所有已注册的侦听器。该活动无法取消。