下拉菜单不是最重要的

Question

data-toggle="dropdown"我遇到了一些困难。它会打开，但只会在居住地div内呈现，如下图所示：

部分HTML：

<div class="row pull-right">
    <div class="col-md-12">
        <div class="btn-group">
            <button data-toggle="dropdown" class="btn btn-xs btn-link dropdown-toggle" aria-expanded="false">
                <i class="fa fa-ellipsis-h fa-lg" aria-hidden="true"></i>
            </button>
            <ul class="dropdown-menu">
                <li><a href="" ng-click="vm.doSomeStuff(args)">Delete</a></li>
            </ul>
        </div>
    </div>
</div>  

Dropdown css：

我能解决这个问题吗？

Codepen示例：example

谢谢！

Answer 1

它是由slimScroll aka fullScroll指令引起的，该指令添加了以下内联样式（在运行时）：

以下codepen，演示了问题......

 <div full-scroll style="overflow: hidden; width: auto; height: 100%;">
    <div class="full-height-scroll">
        ...
    </div>
    <div class="slimScrollBar"></div>
    <div class="slimScrollRail"></div>
</div>

指令：

/**
 * fullScroll - Directive for slimScroll with 100%
 */
function fullScroll($timeout){
    return {
        restrict: 'A',
        link: function(scope, element) {
            $timeout(function(){
                element.slimscroll({
                    height: '100%',
                    railOpacity: 0.9
                });

            });
        }
    };
}

添加内联样式：

<强> [UPDATE]

以下修复了此问题：

<div class="btn-group" uib-dropdown dropdown-append-to-body>
    <button class="btn btn-xs btn-link" aria-expanded="false" uib-dropdown-toggle>
        <i class="fa fa-ellipsis-h fa-lg" aria-hidden="true"></i>
    </button>
    <ul uib-dropdown-menu>
        <li><a href="" ng-click="vm.doSomeStuff(ms)">Delete</a></li>
    </ul>
</div>