AngularJS UI网格和Popover对齐

嗨我添加到AngularJS的UI网格popover。这个想法是当用户将鼠标悬停在一行上时，弹出窗口将显示出来，并且弹出窗口包含一个指令。我已经成功地实现了这个部分，但现在的问题是酥料饼的那部分由UI网格表受阻，就像这样： AngularJS UI网格和Popover对齐

我希望把酥料饼的前面，和我已经尝试为ui网格表和popover设置z-index。相关的代码是在这里：

JS部分：

function rowTemplate() { 
    var template = []; 
    ... 
    template.push('popover-template="\'popover.html\'" popover-placement="bottom" popover-trigger="click"></div>'); 
    return template.join(' '); 
}

HTML：

<div class="gridStyle" ui-grid="vm.grid" ui-grid-resize-column ui-grid-selection style="margin-top:0px; height:200px; z-index: 4; position: relative"> 
</div> 

<script type="text/ng-template" id="popover.html"> 
    <div style="height: 150px; width: 600px; overflow-x: auto; overflow-y: hidden; z-index: 10; position: relative"> 
     <directive-related part /> 
    </div> 
</script>

但经过我设置的z-index它仍然没有工作。我该如何解决这个问题？我的一些参考文献在这里：popover：popover，z-index：z-index。

谢谢！

来源

2016-06-08 richards

没有ü尝试hieght了和宽度弹出，或创建小提琴来解决问题 –

@gayathri：是的代码是现在更新。我把它们放在原始代码中;只是没有把它们全部粘贴在这里。 – richards

注意：我在这里假设您使用的是ui-bootstrap。

我发现通常您需要使用ui-grid自定义格式的append-to-body属性。

尝试更改模板像这样以添加属性：

template.push('popover-template="\'popover.html\'" popover-append-to-body="true" popover-placement="bottom" popover-trigger="click"></div>')

来源

2016-06-08 11:45:23 Brian

AngularJS UI网格和Popover对齐

回答

相关问题