Question

在角度代码中，我有一个代码可以在$ locationChangeStart触发时验证。我必须调用event.preventDefault（）来取消它并显示一个bootstrap模式。但是我必须使用模态按钮单击两次才能使每个按钮操作生效。以下是代码：

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

    if (skipValidation.skipAllowed($scope.filteredQuestions[0])) {
        //some code here
    }
    else {

        event.preventDefault();

        skipValidation.openModal();
    }
});

openModal（）函数......

this.openModal = function (size, locationChange) {

    var modalInstance = $uibModal.open({
        animation: true,
        templateUrl: 'skipModalContent.html',
        controller: 'SkipModalInstance',
        size: size,
        resolve: {
        }
    });

    modalInstance.result.then(function () {
        //$log.info('continue');
    }, function () {
    });
};

skipModalContent.html

<script type="text/ng-template" id="skipModalContent.html">
                    <div class="modal-header">
                        <h3 class="modal-title text-warning">Warnung!</h3>
                    </div>
                    <div class="modal-body">
                        Frage ist erforderlich, zu beantworten.
                    </div>
                    <div class="modal-footer">
                        <button class="btn btn-default" type="button" ng-click="continue()">mache trotzdem weiter</button>
                        <button class="btn btn-default" type="button" ng-click="cancel()">schließen</button>
                    </div>
                </script>

skipModalInstance controller ...

var skipModalInstanceCtrl = function ($scope, $uibModalInstance, $window) {

$scope.continue = function () {
    $uibModalInstance.close();
    $window.skipModal = true;
};

$scope.cancel = function () {
    $uibModalInstance.dismiss('cancel');
    $window.skipModal = false;
};
};
app.controller('SkipModalInstance', skipModalInstanceCtrl);

非常感谢您的帮助。

Answer 1

我终于找到了问题。 $ locationChangeStart被调用两次，因此打开了两个模态。

使用event.preventDefault单击即可触发bootstrap模式按钮

1 个答案: