Javascript 在单个页面中调整ag grid多个实例的所有列的大小
我在一个页面中有多个Ag grid table实例,当我调整浏览器窗口的大小时,列不会自动调整为表格的宽度,我们只使用一个Ag grid实例来显示页面中的所有网格,但网格调整(onGridReady事件)正在工作,它仅适用于上次加载的Ag grid,请帮帮我,谢谢Javascript 在单个页面中调整ag grid多个实例的所有列的大小,javascript,jquery,ag-grid,ag-grid-angular,Javascript,Jquery,Ag Grid,Ag Grid Angular,我在一个页面中有多个Ag grid table实例,当我调整浏览器窗口的大小时,列不会自动调整为表格的宽度,我们只使用一个Ag grid实例来显示页面中的所有网格,但网格调整(onGridReady事件)正在工作,它仅适用于上次加载的Ag grid,请帮帮我,谢谢 function loadaggrid(id,rowdata,columndata){ var gridOptions = { defaultColDef:{
function loadaggrid(id,rowdata,columndata){
var gridOptions = {
defaultColDef:{
editable: false,
enableRowGroup:true,
enablePivot:true,
enableValue:true,
sortable: true,
resizable: true,
filter: true
},
autoGroupColumnDef: {
width: 180
},
animateRows: true,
debug: false,
suppressAggFuncInHeader: true,
sideBar: {
toolPanels: [{
id: 'columns',
labelDefault: 'Columns',
labelKey: 'columns',
iconKey: 'columns',
toolPanel: 'agColumnsToolPanel',
toolPanelParams: {
suppressPivots: true,
suppressPivotMode: true,
}
}],
},
rowSelection: 'single',
columnDefs: cols,
rowData: data,
floatingFilter:true,
paginationAutoPageSize:true,
pagination: true,
onGridReady: function (params) {
window.onresize = () => {
setTimeout(function(){
params.api.sizeColumnsToFit();
},500);
}
},
onFirstDataRendered(params) {
params.api.sizeColumnsToFit();
}
}
new agGrid.Grid(id, gridOptions);
}
您需要为每个网格实现不同的onGridReady函数
//firstGridOptions:
onGridReady: (event) => {
console.log('this is for first grid');
this.firstGridApi.sizeColumnsToFit();
},
//secondGridOptions:
onGridReady: (event) => {
console.log('this is for second grid');
this.secondGridApi.sizeColumnsToFit();
},
感谢您的回复,但是对于ag grid的所有实例,我们只使用了一个gridoption,我们只发送了colunms和rowData,我已经在问题中添加了示例代码,您必须为相应的ag grid提供不同的grid选项实例。谢谢您的回复,但在我的例子中,我们有一个仪表板,用户可以为每个实例添加多个ag网格表,我们无法编写代码bcoz其动态我们不知道他可以向仪表板添加多少创建一个返回gridOption的函数。然后为每个网格获取一个选项,并将其分配给动态创建的网格。