2015-07-04 2 views
1

Я поймаю modal.hidden событие и сделаю некоторую проверку на него. Когда проверка ложна, я хочу, чтобы модальный не скрывался. Я использую e.preventDefault(). Но это не сработает. мой код:Как предотвратить ионный модальный из хэширования

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

мой код в codepen

ответ

10

Вы можете использовать опцию backdropClickToClose и hardwareBackButtonClose при настройке модальности, а также скрыть кнопку назад. Это предотвратит модальный от закрытия:

// 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; 
}); 

Вы можете сделать некоторые проверки и установить эти значения 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) 
} 

Обновленный codepen here

+0

Спасибо за ваш ответ. Но в платформе Android пользователи привыкли использовать кнопку возврата оборудования для возврата. Я считаю, что это не принесет плохих результатов. –

+0

Хорошо, я обновил ответ. – novalain

+0

Большое спасибо. Ваш ответ решил мою проблему –