如何根据angulargrid上的行计数执行动态高度 [英] How do I do dynamic height based on row count on the angulargrid

问题描述

我正在使用angulargrid库来表格。我试图基于angulargrid上的行计数实现动态高度，并使我的表适合整个页面，而不是像现在一样在小表中滚动数据。为此，我编写了一个可以帮助完成此任务的函数。 br />


我的代码：angularjs



var columnDefs = [



{headerName：headerName1字段：field1}

{headerName：headerName2字段：field2}



];

var rowData = [];

scope.gridOptions = {

columnDefs：columnDefs，

rowData：null，

pinnedColumnCount：2，

dontUseScrolls：true，

angularCompileRows：true，

enableSorting：true，

enableCellExpressions：tru e，

enableFilter：true，

rowSelection：'multiple'，

groupSuppressAutoColumn：true，

groupIncludeFooter： false，

groupHidePivotColumns：true，

groupUseEntireRow：true，





function setHeight（更多）{

scope.height =（（$ scope.gridOptions.data.length * 30）+ 30）;

if（more）{

scope.height + =更多

}

scope.gridOptions.api.gridHeight = scope.height;

< br $>


HTML：

I am using angulargrid library for a table grid. I am trying to implement dynamic height based on row count on the angulargrid and make my table fit the whole page and not scroll the data in a small table as is now.To do that I wrote a function that could help achieve this task.

My code: angularjs

var columnDefs = [

{headerName:"headerName1" field: "field1"}
{headerName:"headerName2" field: "field2"}

];
var rowData = [];
scope.gridOptions = {
columnDefs: columnDefs,
rowData: null,
pinnedColumnCount: 2,
dontUseScrolls: true,
angularCompileRows: true,
enableSorting: true,
enableCellExpressions: true,
enableFilter: true,
rowSelection: 'multiple',
groupSuppressAutoColumn: true,
groupIncludeFooter: false,
groupHidePivotColumns:true,
groupUseEntireRow: true,


function setHeight(more) {
scope.height = (($scope.gridOptions.data.length * 30) + 30);
if (more) {
scope.height += more
}
scope.gridOptions.api.gridHeight = scope.height;


HTML:

ag-grid =gridOptionsclass =ag-fresh style =width：100％;身高：600px;>

ag-grid="gridOptions" class="ag-fresh" style="width: 100%; height: 600px;" >

它不会动态调整网格大小。我的数据没有任何确切的结果。有人可以帮我解释为什么这不起作用吗？

It does not resize the grid dynamically. Nothing happens exactly to my data. Can someone please help me why this is not working?

推荐答案

scope.gridOptions.data。长度* 30）+ 30）;

if（更多）{

scope.height + = more

}

scope.gridOptions.api.gridHeight = scope.height;





HTML：

scope.gridOptions.data.length * 30) + 30);
if (more) {
scope.height += more
}
scope.gridOptions.api.gridHeight = scope.height;


HTML:

ag-grid =gridOptionsclass =ag-freshstyle =width：100％;身高：600px;>

ag-grid="gridOptions" class="ag-fresh" style="width: 100%; height: 600px;" >

它不会动态调整网格大小。我的数据没有任何反应。有人可以帮我解释为什么这不起作用吗？

It does not resize the grid dynamically. Nothing happens exactly to my data. Can someone please help me why this is not working?

这篇关于如何根据angulargrid上的行计数执行动态高度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！