Question

如果他在Angular中更改了某些内容，我试图阻止用户离开该表单。我已经阅读了一些关于此的文章并找到了$ locationChangeStart。问题是，在我修改表单中的内容然后导航到其他页面后，此方法不会被触发。仅调用window.onbeforeunload。

这是指令：

.directive(
            'confirmOnExit',
            function() {
                return {
                    link : function($scope, elem, attrs) {
                        $scope
                                .$on(
                                        '$locationChangeStart',
                                        function(event, next, current) {
                                            if ($scope.addEventForm.$dirty) {
                                                if (!confirm("The form is dirty, do you want to stay on the page?")) {
                                                    event.preventDefault();
                                                }
                                            }
                                        });
                        window.onbeforeunload = function() {
                            if ($scope.addEventForm.$dirty) {
                                return "You have unsaved information!";
                            }
                        };
                    }
                };

以下是表格：

<form name="addEventForm"
            method="POST" ng-controller="formController" confirm-on-exit>
...

</form>

我哪里错了？

Answer 1

如果您遇到此问题，请按照评论中的建议尝试使用 $ locationChangeStart 的$ rootScope。或者，如果您使用的是Angular UI-Router，请使用 $ stateChangeStart ：

$rootScope.$on('$stateChangeStart', warnIfUnsavedChanges);

如果使用ngRoute，

$ routeChangeStart 。

Difference between $locationChangeStart, $routeChangeStart, and $stateChangeStart

Angularjs $ locationChangeStart不会触发

1 个答案: