UI Bootstrap模态窗口“跳出”角度控制器

Question

我正在尝试在Angular控制器中使用UI Bootstrap的模态对话框，在Asp MVC视图中呈现。

在页面的某个地方，我嵌入了模态div：

<div class="modal inmodal" id="newActivityModal" tabindex="-1" role="dialog" aria-hidden="true">

由以下方式触发：

<button ng-disabled="vm.activityInputText.length == 0" type="submit" class="btn btn-sm btn-primary" data-toggle="modal" data-target="#newActivityModal">

所以页面的结构是：

<!-- ng-module="xxx" -->
...
   <!-- ng-controller="zzz" -->
   ...
       <!-- button triggering modal -->
       ....
           <!-- modal -->

然而问题是，当页面呈现时，模态窗口div'跳出'原来的div（在控制器内部）并出现在页面的最底部，就在body标签之前。 因为在模态中我使用绑定到控制器范围的{{}}，所以它会中断。

我这样做对吗？ 有趣的事实是：如果我将所有这些（控制器，按钮，模态窗口等）放在<ng-view>内，它可以正常工作并且模态保持在DOM中的位置。