如何将数据加载到 ag-grid 中的 rowData？

Question

我的 html-class 中有以下代码：

<ag-grid-aurelia #agGrid class="ag-theme-balham" style="width: 100%; height: 350px;" #agGrid  grid-ready.call="onGridReady()"
                             grid-options.bind="filesThatAreMalwareOptions">

                <ag-grid-column header-name="date" field="date" width.bind="300"></ag-grid-column>
                <ag-grid-column header-name="fileHash" field="fileHash" width.bind="300"></ag-grid-column>
                <ag-grid-column header-name="fileName" field="fileName" width.bind="300"></ag-grid-column>
                <ag-grid-column header-name="fileSize" field="fileSize" width.bind="300"></ag-grid-column>
                <ag-grid-column header-name="mimeType" field="mimeType" width.bind="300"></ag-grid-column>
                <ag-grid-column header-name="Malware" field="Malware" width.bind="300"></ag-grid-column>
                <ag-grid-column header-name="Virustotal-Link" field="Virustotal-Link" width.bind="300"></ag-grid-column>
</ag-grid-aurelia>

以及我的 TypeScript 中的以下代码-class:

filesThatAreMalwareOptions:GridOptions = {
      rowData:  []      
    };

getValueFromRequest(queryEndpoint){
        this.http
            .fetch(queryEndpoint, {
                mode: "cors"
            })
            .then(result => result.json()
            ).then(body => {
            if (queryEndpoint == "TestFileData"){
                this.filesThatAreMalwareOptions.rowData = JSON.parse(body);
            }
            });

如果我想从我的服务端点加载数据，则网格显示 "No rows to show"。如果我将 rowData 硬编码为：

filesThatAreMalwareOptions:GridOptions = {
      rowData:  [ {date: '02.04.1990', fileHash: 'X', fileName: 'X', fileSize: 3245, mimeType: 'PDF'}]
};

数据显示在网格中。从服务加载数据的问题在哪里？

Answer 1

您需要使用 api 调用，而不是直接设置属性行数据：

this.filesThatAreMalwareOptions.api.setRowData(JSON.parse(body));

参见 api 参考资料： https://www.ag-grid.com/javascript-grid-api/

如何将数据加载到 ag-grid 中的 rowData？

How to load data in to rowData in ag-grid?

aurelia

ag-grid