Ag-Grid:无法减少详细信息行的容器空间

问题描述 投票:1回答:1

当Ag-Grid中显示详细行时,似乎有一个固定/计算的高度与容器。我能够使用Ag-Grid文档在Plunker上的示例复制此问题:

本页上的最后一个Plunker示例:https://www.ag-grid.com/javascript-grid-master-detail/

要复制它,一旦在Plunker中我点击了V形符号打开子表来查看详细信息行,然后打开DevTools。我检查了子表周围的容器,它有一个“ag-details”行的类。我添加了一个高度值,例如50%,但它只减少了行的高度。

Plunker screenshot of issue所以我在子表中有大约2-3行。如何删除子表底部与其下方父行之间的额外空间?

angular ag-grid master-detail
1个回答
1
投票

细节行可以指定一个高度。但你所要求的听起来像一个动态的高度,你也可以这样做。

例如,在网格选项中,您可以定义getRowHeight;

getRowHeight: function (params) {
    if (params.node && params.node.detail) {
        var offset = 80;
        var allDetailRowHeight = params.data.callRecords.length * 28;
        return allDetailRowHeight + offset;
    } else {
        // otherwise return fixed master row height
        return 60;
    }
}

有关完整示例,请参阅AG Grid的文档; https://www.ag-grid.com/javascript-grid-master-detail/#example-dynamic-detail-row-height

© www.soinside.com 2019 - 2024. All rights reserved.