UI-GRID - 動態行高 - 替代品

Question

我試圖讓單元動態地擴展它的高度。

有沒有辦法在渲染後調整行（GridRow）的高度？

如果不是，那麼我會嘗試在網格中使用可展開的網格或樹。

是否可以在特定單元格/列上顯示可展開網格？

目前我看到所有可擴展的網格/樹網格，佔據父行下面的整行。

感謝

Answer 1

你可以看到的答案，同樣的問題在這裏：https://github.com/angular-ui/ng-grid/issues/3239#issuecomment-91045267

UI網格虛擬化的行，這意味着它只是呈現數據的一小部分，並保留一切止跌」在視野中，無動於衷。這意味着網格需要知道每一行的高度，以便它可以計算定位。

如果在渲染時必須對每一行進行度量，則會導致瀏覽器反覆重繪並且性能會很糟糕。

您會發現其他虛擬化工具（如Ionic的collection-repeat）具有相同的限制。

更新：

要回答你的第二個問題：你可以在GridRow對象（而不是你的實體，您可以使用getRow從電網API來獲取GridRow對象）和柵格上設置的height屬性渲染行時將使用此高度。

還有你的第三個問題：不，可擴展只是建立在整個行上。根據某些單元格中的點擊次數，可能會更改子網格中顯示的數據類型，但這需要對可擴展代碼進行一些更改。

Answer 2

這個CSS添加到您的樣式：

.ui-grid-viewport .ui-grid-cell-contents { 
    word-wrap: break-word; 
    white-space: normal !important; 
} 

.ui-grid-row, .ui-grid-cell { 
    height: auto !important; 
} 

.ui-grid-row div[role=row] { 
    display: flex ; 
    align-content: stretch; 
}