UI-GRID - 动态行高 - 替代方案 [英] UI-GRID - Dynamic Row Height - Alternatives

问题描述

我试图让一个单元格动态扩展它的高度.

有没有办法在渲染后调整行(GridRow)的高度?

如果没有，那么我会尝试在网格中使用可扩展的网格或树.

是否可以在特定单元格/列之外显示可扩展网格?

目前我看到所有占据父级下方整行的可扩展网格/树形网格.

谢谢

解决方案

您可以在此处查看同一问题的答案:https://github.com/angular-ui/ng-grid/issues/3239#issuecomment-91045267

UI-Grid 对行进行虚拟化，这意味着它只呈现数据的一小部分，而不会呈现未呈现的所有内容.这意味着网格需要知道每一行有多高，以便它可以计算定位.

如果在渲染时必须测量每一行，这将导致浏览器一遍又一遍地重新绘制，性能会很糟糕.

您会发现其他虚拟化工具(如 Ionic 的 collection-repeat)也有同样的限制.

更新:

回答你的第二个问题:你可以在 GridRow 对象上设置一个 height 属性(不是你的实体，你可以使用 getRow 来自网格 API 以获取 GridRow 对象)并且网格在渲染行时将使用此高度.

您的第三个问题:不，可扩展仅用于处理整行.可以根据某些单元格中的点击来更改子网格中显示的数据类型，但这需要对可扩展代码进行一些更改.

I tried to get a cell to expand it's height dynamically.

Is there a way to adjust the height of a row(GridRow) after it is rendered?

If not, then I will try to use an expandable grid or tree in a grid.

Is it possible to display an expandable grid off a specific cell/column?

Currently I see all expandable grids/tree grids that take up the entire row below the parent.

Thanks

解决方案

You can see an answer to the same question here: https://github.com/angular-ui/ng-grid/issues/3239#issuecomment-91045267

UI-Grid virtualizes the rows, meaning that it only renders a small subset of the data, and leaves everything that wouldn't be in view unrendered. This means the grid needs to know how tall every row is, so that it can calculate positioning.

If it had to measure every row when rendered this would cause the browser to repaint over and over and performance would be miserable.

You'll find that other virtualized tools (like Ionic's collection-repeat) have the same limitation.

Update:

To answer your second question: you can set a height property on the GridRow object (not your entity, you can use getRow from the grid API to get the GridRow object) and the grid will use this height when rendering the row.

And your third question: no, expandable is only built to work off entire rows. It might be possible to alter what sort of data is displayed in a sub-grid based on clicks in certain cells, but that would require some changes to the expandable code.

这篇关于UI-GRID - 动态行高 - 替代方案的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！