如何防止离子模式隐藏

Fen*_* Lu 2 ionic-framework ionic ionic-view

我捕获modal.hidden事件,并对其进行检查.当检查结果为false时,我想阻止模态隐藏.我使用e.preventDefault().但它不起作用.我的代码:

$scope.$on('modal.hidden', function(event) {
    var isPassed = false;
    // do some check
    if (isPassed == false) {
        event.preventDefault();
    }  
});
Run Code Online (Sandbox Code Playgroud)

我在codepen中的代码

nov*_*ain 12

您可以在设置模态时使用backdropClickToClosehardwareBackButtonClose选项,也可以隐藏后退按钮.这将阻止模态被关闭:

// Load the modal from the given template URL
$scope.modal = {};
$ionicModal.fromTemplateUrl('my-modal.html', {
    scope: $scope,
    animation: 'slide-in-up',
    backdropClickToClose: false,
    hardwareBackButtonClose: false
}).then(function(modal) {
    $scope.modal = modal;
});
Run Code Online (Sandbox Code Playgroud)

然后,您可以进行一些检查并true再次设置这些值,并显示后退按钮.这仍然是用户友好的,用户可以以适当的方式关闭模态.

function checkSomething(){
    // The timeout is only to demonstrate, do your check here
    $timeout(function(){
      console.log("Now user can close modal")
      $scope.isPassed = true;
      $scope.modal.backdropClickToClose = true;
      $scope.modal.hardwareBackButtonClose = true;
    }, 3000)
}
Run Code Online (Sandbox Code Playgroud)

在这里更新了codepen