不支持 exportDataAsCsv 属性 或 gridOptions.api 的方法

exportDataAsCsv is not supported property or method of gridOptions.api

根据 AG-Grid 文档 here gridOptions.api 上有一种方法允许导出 table 内容的数据。但是,每当我 运行 函数时,我只会收到错误 Object doesn't support property or method 'exportDataAsCsv'.

它 运行 在一个看起来有点像这样的指令中:

app.directive('myDirective', function() {
restrict: 'E',
template-url: "blah.html",
link:{pre: function(scope,ele){
    var columnDefs = [
        { headerName: "Management Name", field: "ManagementName", width: 300 },
        { headerName: "Location", field: "Location", width: 150 },
        { headerName: "Backend System", field: "Vendor", width: 110 },
        { headerName: "Total Active Sites", field: "TotalActiveSites", width: 110 }
    ];
    scope.gridOptions = { columnDefs: columnDefs, rowData: null }
}, 

post: function (scope,ele) {
    scope.exportCsv = function() { scope.gridOptions.api.exportDataAsCsv(); }
    scope.gridOptions.rowData = dataList;
    scope.gridOptions.api.onNewRows();
}

我的 html 看起来像这样:

<input placeholder="Filter..." type="text" ng-model="gridOptions.quickFilterText" />
<button ng-click="exportCsv()">
    <img id="btnExportToExcel" alt="CSV File" src="../images/Excel.gif" style="cursor:pointer;" tooltip-placement="bottom" uib-tooltip="Excel" />
</button>
<div ag-grid="gridOptions" class="ag-blue" style="height:100%"></div>

网格 运行 很好,但出于某种原因,它不认为存在这种方法。关于为什么会这样的任何想法?我正在使用 1.12 版的 ag-grid。我假设我的参考资料都很好,否则我根本不会显示网格。

exportDataAsCsv() 直到 2.0 版才引入。您需要升级到更新版本的 ag-grid,该版本现在位于 v5.x.

如果您绝对坚持使用 v1.12,那么编写您自己的 CSV 数据导出器应该不会太难。

这是 JSFiddle 上的概念验证,可将 JSON 数据转换为 CSV 格式并导出,以便用户保存。要使用它,您只需要将来自 ag-grid 的数据(或来自您首先提供给 ag-grid 的您自己的数据模型)提供给它。

Export ag-grid data as CSV