Question

我正在使用ag-grid开发一个带角度为2的分页组件的网格，已经在html中尝试了以下代码。

QVector<int> v2 = var.value<QVector<int>>();

qDebug() << "Size: " << v2.size();
for(int i = 0; i < v2.size(); i++)
    qDebug() << v2.at(i);

这个结果是一个带有分页按钮的网格，但是rowData没有加载，但是列标题正在进行。我正在加载一个服务的rowData和columnDefs，这是为什么它不起作用？我是以正确的方式做的吗？非常感谢任何帮助

Answer 1

您需要为分页提供数据源 - 请查看[分页文档] [1]以获取更多信息，但简而言之：

var dataSource = {
        rowCount: 100, // for example
        getRows: function (params) { 
                var rowsThisPage = someService.getData(params.startRow, params.endRow);
                params.successCallback(rowsThisPage, lastRow);
        };
}

gridOptions.api.setDatasource(dataSource);

<强>更新

请看第一个[分页示例] [2] - 这说明了如何完成你所追求的目标。

我已经稍微修改了这个示例以适应下面的代码片段 - 这将向您展示如何在一个块中加载文件并设置数据源（尽管最好将它们分成单独的方法）：

// setup the grid after the page has finished loading
var allOfTheData = [];
document.addEventListener('DOMContentLoaded', function() {
    var gridDiv = document.querySelector('#myGrid');
    new agGrid.Grid(gridDiv, gridOptions);

    // do http request to get our sample data - not using any framework to keep the example self contained.
    // you will probably use a framework like JQuery, Angular or something else to do your HTTP calls.
    var httpRequest = new XMLHttpRequest();
    httpRequest.open('GET', '../olympicWinners.json');  // your static json file would go here
    httpRequest.send();
    httpRequest.onreadystatechange = function() {
        if (httpRequest.readyState == 4 && httpRequest.status == 200) {
            allOfTheData = JSON.parse(httpRequest.responseText);

            var dataSource = {
                rowCount: 20,
                getRows: function (params) {
                    // take a chunk of the array, matching the start and finish times
                    var rowsThisPage = allOfTheData.slice(params.startRow, params.endRow);

                    // see if we have come to the last page. if we have, set lastRow to
                    // the very last row of the last page. if you are getting data from
                    // a server, lastRow could be returned separately if the lastRow
                    // is not in the current page.
                    var lastRow = -1;
                    if (allOfTheData.length <= params.endRow) {
                        lastRow = allOfTheData.length;
                    }
                    params.successCallback(rowsThisPage, lastRow);
                }
            };

            gridOptions.api.setDatasource(dataSource);
        }
    };
});

如何在ag-grid中为角度2进行分页

1 个答案: