4

我在控制器中有一个表格。如果有未保存的更改，我想警告用户离开时丢失它们。

首先我试过：

$scope.$on('$locationChangeStart', function (event, next, current) {

    if ($scope.settingsForm.$dirty) {

        event.preventDefault();

        $scope.theUserWantsToLeave(function (result) {

            if (result === "LEAVE") {

                $location.path($location.url(next).hash());
                $scope.$apply();

            }
        });
    }

上面的代码在该行中引发错误$scope.$apply();：

Error: $digest already in progress

删除此行只是不执行重定向。

什么是正确的方法？

===

编辑：

我尝试的其他选项是仅在需要取消重定向时才做出反应来处理它：

  $scope.$on('$locationChangeStart', function (event, next, current) {

    if ($scope.settingsForm.$dirty) {

      $scope.theUserWantsToLeave(function (result) {

        if (result === "STAY_HERE") {

          event.preventDefault();

        }
          });
        }
});

以这种方式做事时，用户界面正在中断（我看到对话框然后它消失了）。好像我在处理事件时不能调用另一个异步方法。

4

1 回答 1

1

我设法通过侦听$locationChangeSuccess然后分配$route.current给最后一条路线来中断路线更改。

此外，如果$scope.theUserWantsToLeave是异步的，那么传递给它的回调可能会触发得太晚而无法停止路由更改。您可以通过使用阻塞标志来绕过异步调用，例如okToDiscardChanges在我的示例中。

JS：

$scope.okToDiscardChanges = false;

var lastRoute = $route.current;    
$scope.$on('$locationChangeSuccess', function () {
    if ($scope.settingsForm.$dirty && !$scope.okToDiscardChanges) {
        $route.current = lastRoute;
        $scope.errorMessage = 'You have unsaved changes. Are you sure you want to leave?';
    }
});

HTML：

<form name="settingsForm">
    <!-- form stuff -->
</form>

<div ng-show="errorMessage">
    {{ errorMessage }}
    <label>
        <input type="checkbox" ng-model="okToDiscardChanges"> Discard Changes
    </label>
</div>

希望这有效！

于 2014-02-24T09:31:17.607 回答