Предотвращение блокировки AngularJS на основе логики внутри модального контроллера

Question

Есть ли способ предотвратить использование модальным модулем AngularJS в логике контроллера модального?

Я хочу показать предупреждение, когда пользователи закрывают модальный, а форма внутри модала содержит несохраненные данные.

Я попытался найти событие до закрытия или что-то еще, что я мог бы использовать в official documentation, но пока не повезло.

Answer 1

Вы можете посмотреть «» modal.closing событие, транслируемое в рамках модальной, как и это:

.controller('modalCtrl', function($scope, $modalInstance) { 

    $scope.$on('modal.closing', function(event, reason, closed) { 
     var r = prompt("Are you sure you wanna close the modal? (Enter 'YES' to close)"); 

     if (r !== 'YES') { 
     event.preventDefault(); 
     } 
    }); 
}) 

Первый параметр является событие, который вы можете preventDefault() для предотвращения это от закрытия.

Второй параметр является причиной (все, что передается методу $ близко())

Третий параметр представляет собой логическое , указывающее, был ли модальное закрыто или отклонено.

Здесь работает plunker

Я не знаю, когда это было добавлено, но в настоящее время он упоминается в официальной документации.

Answer 2

Если вы установили backdrop: 'static' в свой modalInstance, то разрешите проблему?

Как это:

var modalInstance = $modal.open({ 
    ... 
    backdrop: 'static', 
    ... 
}); 

Затем вам нужно только контролировать кнопку ngClick ответственного закрыть модальный.

Надеюсь, это поможет.

UPDATE 1 [только подробнее]

Использование keyboard: false для отключения Escape:

var modalInstance = $modal.open({ 
    ... 
    backdrop: 'static', 
    keyboard: false 
    ... 
}); 

UPDATE 2

Я исследовал и нашел вариант. В вашем модальный контроллер, используйте:

$modalInstance.result.then(function (e) { 
    //... 
}, function (e) { 
    //called before modal close 
}); 

Пример:

var modalInstance = $modal.open({ 
    templateUrl: templateUrl, 
    controller: modalController 
}); 

function modalController($scope, $modalInstance){ 

... //your code 

    $modalInstance.result.then(function (e) { 
     //... 
    }, function (e) { 
     //called before modal close 
    }); 

... //your code 

} 

Но вам нужен способ, чтобы не продолжать мероприятия для закрыть модальный. Или разрешите пользователю сохранять данные до закрытия. Вот что дошло.

ОБНОВЛЕНИЕ 3

Check this.

Answer 3

Это остановит фон от запуска события $ modal.close:

$modal.open({ 
    // ... other options 
    backdrop : 'static', 
    keyboard : false 
}); 

ESC ключ помощи клавиатуры по-прежнему можно закрыть модальный, так что если вы хотите DIABLE, что использование keyboard: false