Bootstrap 3 的 Angular Dialog 指令 [英] Angular Dialog directives with Bootstrap 3

问题描述

我们正在尝试从 Bootstrap 2.3.2 迁移到 Bootstrap 3 (RC1)，但在使用 时遇到了问题AngularJS 对话框指令.单击相关按钮时不会出现对话框弹出窗口(页面显示为黑色.单击任意位置返回原始非黑色视图).

We're trying to migrate from Bootstrap 2.3.2 to Bootstrap 3 (RC1) and are having problems with the AngularJS Dialog directive. On clicking the relevant button no dialogue popup appears (the page appears black. Clicking anywhere returns to the original non-black view).

我们基本上使用与上述链接中完全相同的代码.

此处讨论了一个已知问题.在那次讨论中，路德建议:

There is a known issue discussed here. In that discussion Luther suggests:

要使模态起作用，添加隐藏类以将 display:none 设置为模态并将模态的显示重置为阻止"

不幸的是，这似乎没有任何区别.我们可以使用哪些替代方法来让 Bootstrap 3 RC1 中出现对话框?

That unfortunately doesn't seem to make any difference. What alternatives could we use to get the dialogs appearing in Bootstrap 3 RC1?

我尝试过使用 Modal 指令.它有一个类似的问题，即页面褪色(而不是完全变黑)并且弹出窗口也没有出现.

I've tried using the Modal directive instead. It has a similar problem where the page fades (rather than goes completely black) and the popup also doesn't appear.

推荐答案

正如其他答案所述，这是由于 Bootstrap 3 中的重大更改.直到 Angular UI 团队修复这些问题(目前正在开发中，请参阅bootstrap3_bis 分支)有一个 css 解决方法，仅适用于 这篇博文:

As the other answers have stated, this is due to breaking changes in Bootstrap 3. Until the Angular UI team have fixed these issues (currently under development, see the bootstrap3_bis branch) there is a css workaround just for dialog boxes detailed in this blog post:

.modal { display: block; }

工作 plunkr 可在此处获得:

Working plunkr is available here:

http://plnkr.co/edit/nZT58YNKT84UlSwTvfpc?p=preview

这篇关于Bootstrap 3 的 Angular Dialog 指令的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！