angularjs - 与 Bootstrap 模式弹出窗口后面的内容交互

Question

我在 AngularJS 项目中使用 Angular UI Bootstrap 来实现模态弹出窗口。

模态框有一个这样的父 div:

<div tabindex="-1" role="dialog" class="modal fade ng-isolate-scope responsiveModal in" ng-class="{in: animate}" ng-style="{'z-index': 1050 + index*10, display: 'block'}" ng-click="close($event)" modal-window="" window-class="responsiveModal" index="0" animate="animate" style="z-index: 1050; display: block;">

这个父容器覆盖了整个屏幕并防止用户与模态框旁边或下方的元素进行交互。有什么办法可以改变吗？

我还在模态选项中尝试了 'backdrop: false,'。

Answer 1

不修改 Bootstrap 本身，不。如果您愿意这样做，那么是的，但这并不简单。

话虽这么说，但我觉得有义务指出，根据定义，模态视图应该阻止自身外部的输入，直到用户完成与它的交互。如果您希望他们能够在启动时与其他事物进行交互，这不是模态。那是一个弹出窗口。这就是为什么他们没有任何东西允许在模态之外进行交互。