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對齊

回答

相關問題