Question

该指令使用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（）不会重定向。

Answer 1

似乎SweetAlert正在＆＃34;射击＆＃34;甚至在你的$state.go功能上也不会让状态发生变化但是第二次没有显示警报。

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

在小提琴中，我为$state.go函数添加了一点暂停（您可以删除超时，它只是针对以下示例），如果删除此代码中的isconfirmed部分：

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

你可以看到它再次激发了SweetAlert。

解决方案是设置一个我在这里命名的变量isconfirmed，它可以防止SweetAlert再次触发。

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

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

在离开指令前确认

1 个答案: