非模态/非模态对话框中AngularJS没有使用jQuery的用户界面 [英] Non-Modal/Modeless Dialogs in AngularJS without using jquery-ui

问题描述

我想创建我的AngularJS应用程式非模态对话框。

I am trying to create non-modal dialogs in my AngularJS app.

应用程序使用引导为好。

The app uses Bootstrap as well.

我想创建一个可拖动对话框，它仍然活跃，而背景的其余部分可以用（非模态的定义）进行互动。

I am trying to create a draggable dialog, which remains active while the rest of the background can be interacted with (non-modal definition).

所以，到目前为止，我还打了引导模式不适合与上述要求。

So, far I have played with Bootstrap modal which doesn't fit in with the above requirement.

该库：
https://github.com/jwstadler/angular-jquery-dialog-service

这正是我需要的，有一个缺点这种使用jQuery的用户界面（我不能使用，因为它太大了）

is exactly what I need, with one drawback this uses JQuery-UI (which I can't use, as it is too big)

这是如何实现这一目标与至少依赖任何指针？

Any pointers on how to achieve this with least dependencies ?

修改（二零一四年八月二十零日）：
我结束了编写JavaScript code为无模式对话框，要求所有工作不错。

EDIT (20 August, 2014): I ended up writing javascript code for the non modal dialogs, all working good as required.

修改（2015年4月28日）：
因为，我不能在这里发表的答案我自己的问题。此页面应被视为一样的结果。

EDIT (28 April, 2015): Since, I can not post the answer here to my own question. This page should be seen just as findings.

推荐答案

使用Bootbox和将其设置为禁用其模式的风格：

Use Bootbox and set this to disable its modal style:

.bootbox {
    overflow:visible;
    height:1px;
    position:absolute; /* if necessary */
}

此外，你必须调用该JavaScript code：

Also, you'll have to call this JavaScript code:

$(document).off('focusin.bs.modal'); // disable Bootstrap's anti-focus stuff
$('body').removeClass("modal-open");

这篇关于非模态/非模态对话框中AngularJS没有使用jQuery的用户界面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！