通过容器 div Id 获取 ag-grid 实例

Question

我知道为了生成新的 ag-Grid，我们可以执行以下操作：

    new agGrid.Grid(gridDiv, gridOptions);

其中 gridDiv 是 ag-grid 的“容器 div”， gridOptions 是网格的选项。

鉴于我有它的“容器 div”ID，是否可以获取网格实例？我基本上想访问它的 gridOptions / gridOptions.api

Answer 1

此答案假设您有权访问该代码。

如果您可以控制gridOptions. 一旦网格被初始化，这意味着执行此行之后

new agGrid.Grid(eGridDiv, gridOptions);

它传递gridApi给columnApi你的gridOptions. 您可以开始按照您想要的方式操作该表。这是一个小例子

// at this point you don't have accesss to the API yet
var gridOptions = {
  columnDefs: columnDefs,
  rowData: rowData,
};

var eGridDiv = document.querySelector('#myGrid');

// initialize ag-grid
new agGrid.Grid(eGridDiv, gridOptions);

// grid APIs are ready, we can print current column state for example
console.log(gridOptions.columnApi.getColumnState());

setTimeout(() => {
  var sort = [
    { colId: 'price', sort: 'desc' },
  ];
  gridOptions.api.setSortModel(sort);
}, 2000)

在这里查看现场演示

参考

• https://www.ag-grid.com/javascript-grid