javascript - 请假前确认指令

该指令使用SweetAlert来代替Confirm（）js函数。
https://jsfiddle.net/alfredopacino/njccccsh/

app.directive('confirmLeave',function(){
return {
    restrict:"A",
    controller:function($scope,$attrs,SweetAlert,$state,$location){
        $scope.$on('$destroy', function() {
            window.onbeforeunload = undefined;
        });
        $scope.$parent.$on('$stateChangeStart', function(event, next, current) {
            console.log($scope.formname.$dirty)

            if($scope.formname.$dirty){
            event.preventDefault()
                SweetAlert.swal({
                        title: "Are you sure you want to leave this page?",
                        text: "Some changes have not been saved.",
                        type: "warning",
                        showCancelButton: true,
                        confirmButtonColor: "#DD6B55",confirmButtonText: "Ok",
                        cancelButtonText: "Cancel",
                        closeOnConfirm: true,
                        closeOnCancel: true },
                    function(isConfirm){
                        if (isConfirm) {
                            console.log(next.name)
                            $state.go(next.name)
                            //$location.path(next.name)
                        }
                    });

            }

        });
    }
}});

它检查表单的脏状态，并在确认的情况下遵循下一条路线，但是$ state.go（）不会重定向。

最佳答案

甚至在您的$state.go函数上，SweetAlert似乎也正在“触发”，并且不允许状态更改，但是第二次不显示警报。

我开了个小提琴：https://jsfiddle.net/dor2detj/1/

在小提琴中，我为$state.go函数添加了一点超时（您可以删除超时，仅在以下示例中存在），如果您删除了这段代码中的isconfirmed部分，则可以：

if($scope.formname.$dirty && isconfirmed === false){
  ...
}

您会看到它再次触发了SweetAlert。

解决的办法是设置一个变量，在这里我将其命名为isconfirmed，以防止SweetAlert再次触发。

在更远的地方，您可以使用textarea / input / form中的ng-change将变量isconfirmed再次设置为false，以在用户更改输入时再次弹出警报。

希望您可以基于此示例使代码正常工作。

关于javascript - 请假前确认指令，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/37073107/