Question

有一个Angular draggable指令here。

可以应用于AngularUI模式弹出窗口吗？

我创建了一个名为ngdrag.js的文件，其中放置了指令代码，该文件已加载到HEAD部分。

    <link href="css/bootstrap.min.css" rel="stylesheet" />
    <script type="text/javascript" src="js/angular.js"></script>
    <script type="text/javascript" src="js/ui-bootstrap-tpls-0.11.0.min.js"></script>
    <script type="text/javascript" src="js/ngdrag.js"></script>
    <script type="text/javascript" src="js/Test1.js"></script>

我的模块包含它：

     var myApp = angular.module('myApp', ['ui.bootstrap','ngdrag']);

和为我的弹出窗口提供内容的html片段执行此操作：

   <script type="text/ng-template" id="myModalContent.html" 
        class='modal-window' draggable>

但无法拖动模态窗口。

我可以看到在加载页面时正确调用了该指令：调试器暂停在ngdrag.js中设置的断点处。

 return function (scope, element, attr) {

           <breakpoint here>   var startX = 0, startY = 0, x = 0, y = 0;

但mousedown事件没有被听到＆＃34;通过可拖动指令。模态是否吞下了mousedown事件？

Answer 1

我偶然发现了这个掠夺者的例子（没有试图为它取信 - 不是我写的）：

http://embed.plnkr.co/8CHoiN/preview

因此，您可以查看代码，了解它是如何实现的。

Angular draggable指令不使用AngularUI模式对话框

1 个答案: