Angular UI Bootstrap Modal - 如何防止用户交互

Question

在我目前的用例中，我正在尝试使用angular-ui模态窗口来显示我们在后台进程中执行的计算进度，我们在完成后禁用它。

一切运作良好。我只是想禁止用户点击后台的任何元素。

我们怎么能这样做？

Answer 1

打开模态窗口时，您可以传递以下选项，以防止用户关闭窗口：

• backdrop: 'static' - 顶部阻止用户点击背景上的模式点击
• keyboard: false - 因此用户无法按ESC
关闭窗口

此处提供完整文档：http://angular-ui.github.io/bootstrap/#/modal

Answer 2

我只想添加一个带代码的示例并扩展pkozlowski.opensource的答案， 检查此示例：

    var modalInstance = $modal.open({
        templateUrl: '/views/registration/loginModal.html',
        controller: LoginModalInstanceCtrl,
        windowClass: 'login-modal-window',
        resolve : { 
          credentials : function(){ return {email :'', password:''}; }
        },
        backdrop: 'static', /*  this prevent user interaction with the background  */
        keyboard: false
      });

      modalInstance.result.then(function (res) {

      }, function () {
         /*  cancel */
         $state.go('home');
  });