如何使用Ag-Grid动态增加行高?

时间:2016-10-11 13:38:45

标签: javascript css ag-grid

我有一张使用ag-Grid的表格。我想根据单元格中的文本调整行高。在文档https://www.ag-grid.com/javascript-grid-row-height/index.php中,它是针对特定列的。但就我而言,任何专栏都可以有更多文字。那么如何根据任何列中的最大文本大小调整行高。

$scope.gridOptions = {
            angularCompileRows: true,
            enableColResize: true,
            enableSorting: true,
            enableFilter: true,
            groupHeaders: true,
            suppressCellSelection: true,
            columnDefs: cols,
            rowData: statusPageObj.rows,
            onGridReady: opmGridReady,
            angularCompileRows: true,
            headerHeight: 45,
            /*rowHeight: 50,*/
            getRowHeight: function(params) {
               return 50;
            }

        };

2 个答案:

答案 0 :(得分:2)

步骤:1 html代码

<button onclick="setrowHeight(50)">50px</button>

步骤:2 js代码

var rowHeight = 25;

function setrowHeight(height) {
    rowHeight = height;
    gridOptions.api.resetRowHeights();
}

观看此https://embed.plnkr.co/FEK7wtQfVwUXeYjOh6PK/

答案 1 :(得分:0)

您可以根据文字长度确定行的高度。

gridOptions.getRowHeight = function() {
     return 18 * (Math.floor(params.data.myDataField.length / 45) + 1);
}