我在Angular中使用Bootstrap UI(https://angular-ui.github.io/bootstrap/)中的模态组件来渲染模态,在关闭时我希望能够重定向到另一个状态,或者至少有一个函数是调用。
问题是我可以拦截close
事件,但每当我用户按Esc
时,模态都会被解除,我无法找到任何捕获dismiss
事件的文档或将函数分配给返回的promise。
代码如下:
var modalInstance = $uibModal.open({
templateUrl: 'a-template.html',
controller: 'AnotherCtrl',
controllerAs: 'modal',
backdrop: false,
size: 'lg'
});
// I am able to catch this whenever the user exits the modal in an
// orthodox fashion. Doesn't happen when he presses Esc button.
modalInstance.closed = function () {
$state.go(homeState);
};
另一种适合我的商业案例的解决方案是简单地不允许用户解雇模态。每当模态控制器中发生事件时自己关闭它。到目前为止,我都没有找到这方面的功能。
答案 0 :(得分:20)
在与模态关联的控制器中(" AnotherCtrl"或"模态"为您),您可以将$scope.$on()
与'modal.closing'
事件一起使用。< / p>
示例:
var modalInstance = $uibModal.open({
templateUrl: 'a-template.html',
controller: ['$scope', function($scope){
$scope.$on('modal.closing', function(event, reason, closed){
if('condition for not closing')
event.preventDefault(); //You can use this to prevent the modal from closing
else
window.location = "https://www.youtube.com/watch?v=dQw4w9WgXcQ";
});
}],
controllerAs: 'modal',
backdrop: false,
size: 'lg'
});