Question

我在我的项目中使用Angular UI $ modal http://angular-ui.github.io/bootstrap/#/modal

我不希望用户通过按背景来关闭模态。我想只能通过按下我创建的关闭按钮来关闭模态。

如何阻止模态关闭？

Answer 1

在创建模态时，您可以指定其行为：

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

Answer 2

backdrop : 'static'

适用于“点击”事件，但您仍然可以使用“Esc”键关闭弹出窗口。

keyboard :false

通过“Esc”键阻止弹出窗口关闭。

感谢pkozlowski.opensource的回答。

我认为问题是重复的 Angular UI Bootstrap Modal - how to prevent user interaction

Answer 3

旧问题，但是如果要在各种关闭操作上添加确认对话框，请将其添加到模态实例控制器中：

$scope.$on('modal.closing', function(event, reason, closed) {
    console.log('modal.closing: ' + (closed ? 'close' : 'dismiss') + '(' + reason + ')');
    var message = "You are about to leave the edit view. Uncaught reason. Are you sure?";
    switch (reason){
        // clicked outside
        case "backdrop click":
            message = "Any changes will be lost, are you sure?";
            break;

        // cancel button
        case "cancel":
            message = "Any changes will be lost, are you sure?";
            break;

        // escape key
        case "escape key press":
            message = "Any changes will be lost, are you sure?";
            break;
    }
    if (!confirm(message)) {
        event.preventDefault();
    }
});

我的右上角有一个关闭按钮，触发＆＃34;取消＆＃34;行动。单击背景（如果已启用），将触发取消操作。您可以使用它来为各种近距离事件使用不同的消息。

Answer 4

这是文档

中提到的内容

背景 - 控制背景的存在。允许的值：true （默认），false（无背景），'静态' - 背景存在但是单击模态窗口外部时，模态窗口未关闭。

static可能有用。

Answer 5

对于新版本的ngDialog（0.5.6），请使用：

closeByEscape : false
closeByDocument : false

如何防止angular-ui模态关闭？

5 个答案: