Ag Grid Export to Excel for Server side pagination row model

Question

我无法在 ag-grid 文档中找到有关服务器端行模型导出数据的任何有用详细信息。好像支持导出已经加载的数据

我们有什么方法可以导出完整数据吗excel 我在用 银网格 - 23.1.1 Angular - 9.1.0

Answer 1

是的，AgGrid 仅导出在 Web 客户端上加载的数据。您将需要调用包含所有可能数据的请求（包含所有元素的单页），然后调用 exportAsExcel 方法。

这是一个延伸，因为 excel 在 Web 客户端上导出超过 4000 行是一个真正的痛苦，它会使您的浏览器在一段时间内完全无响应。

如果您正在寻找大量的数据表导出，您可以尝试以异步方式在服务器端进行导出，agGrid在这里帮不了您太多。

Answer 2

上面评论中的答案应该是这样的

function exportAllRowsAsExcel() {
    var columnsHidden = [
        {headerName: '<?php echo ENTERPRISE_CODE; ?>', field: 'code'},
        {headerName: '<?php echo ENTERPRISE_NAME; ?>', field: 'name'},
        {headerName: '<?php echo TAX_NO; ?>', field: 'tax_no'},
        {headerName: '<?php echo Inditex; ?>', field: 'inditex',
            cellRenderer: function(event) {
                var inditex;
                if(event.data.inditex == 0) {
                    inditex = '<?php echo ABSENT; ?>';
                }
                else if(event.data.inditex == 1) {
                    inditex = '<?php echo EXISTS; ?>';
                }
                return inditex;
            },
            valueFormatter: (data) => {
                var inditex;
                if(data.value == 0) {
                    inditex = '<?php echo ABSENT; ?>';
                }
                else if(data.value == 1) {
                    inditex = '<?php echo EXISTS; ?>';
                }
                return inditex;
            },
        },
        {headerName: '<?php echo EcoVero; ?>', field: 'ecoVero',
            cellRenderer: function(event) {
                var ecoVero;
                if(event.data.ecoVero == 0) {
                    ecoVero = '<?php echo ABSENT; ?>';
                }
                else if(event.data.ecoVero == 1) {
                    ecoVero = '<?php echo EXISTS; ?>';
                }
                return ecoVero;
            },
            valueFormatter: (data) => {
                var ecoVero;
                if(data.value == 0) {
                    ecoVero = '<?php echo ABSENT; ?>';
                }
                else if(data.value == 1) {
                    ecoVero = '<?php echo EXISTS; ?>';
                }
                return ecoVero;
            },
        },
        {headerName: '<?php echo JoinLife; ?>', field: 'joinLife',
            cellRenderer: function(event) {
                var joinLife;
                if(event.data.joinLife == 0) {
                    joinLife = '<?php echo ABSENT; ?>';
                }
                else if(event.data.joinLife == 1) {
                    joinLife = '<?php echo EXISTS; ?>';
                }
                return joinLife;
            },
            valueFormatter: (data) => {
                var joinLife;
                if(data.value == 0) {
                    joinLife = '<?php echo ABSENT; ?>';
                }
                else if(data.value == 1) {
                    joinLife = '<?php echo EXISTS; ?>';
                }
                return joinLife;
            },
        },
        {headerName: '<?php echo BCI; ?>', field: 'bci',
            cellRenderer: function(event) {
                var bci;
                if(event.data.bci == 0) {
                    bci = '<?php echo ABSENT; ?>';
                }
                else if(event.data.bci == 1) {
                    bci = '<?php echo EXISTS; ?>';
                }
                return bci;
            },
            valueFormatter: (data) => {
                var bci;
                if(data.value == 0) {
                    bci = '<?php echo ABSENT; ?>';
                }
                else if(data.value == 1) {
                    bci = '<?php echo EXISTS; ?>';
                }
                return bci;
            },
        },
        {
            headerName: '<?php echo CREATED_DATE; ?>', field: 'created_date',
            valueFormatter: function(data) {
                return ((data.value !== null && moment(data.value, 'YYYY-MM-DD',true).isValid()) && (data.value !== '0000-00-00')) ? moment(data.value).format('DD.MM.YYYY') : '';
            },
            cellRenderer: function (event) {
                var created_date = new Date(event.data.created_date);
                return moment(created_date).format('DD.MM.YYYY');
            },
        },
        {headerName: '<?php echo UPDATED_DATE; ?>', field: 'updated_date',
            valueFormatter: function(data) {
                return ((data.value !== null && moment(data.value, 'YYYY-MM-DD',true).isValid()) && (data.value !== '0000-00-00')) ? moment(data.value).format('DD.MM.YYYY') : '';
            },
            cellRenderer: function(event) {
                var updated_date = new Date(event.data.updated_date);
                return moment(updated_date).format('DD.MM.YYYY');
            },
        },
    ];

    var gridOptionsHidden = {
        onGridReady: (e) => {

        },
        onDisplayedColumnsChanged: (e) => {

        },
        onColumnResized: (e) => {

        },
        onSortChanged: (e) => {

        },
        onRowDataChanged: function (params) {
            setTimeout(() => {
                gridOptions.api.exportDataAsExcel({
                    columnKeys: [
                        'code',
                        'name',
                        'tax_no',
                        'inditex',
                        'ecoVero',
                        'joinLife',
                        'bci',
                        'created_date',
                        'updated_date',
                    ],
                    processCellCallback: myCellCallback,
                })
            }, 1000);
        },
    }

//myAgGrid is just a function that calls grid (new agGrid.Grid...)
    App.myAgGrid(columnsHidden, gridOptionsHidden, {csrf_test_name: csrfTokenHash}, '/enterprises/enterprises_list_json', false, '#myGrid1');
}

辅助函数

    function myCellCallback(params) {
    if (params.column.colId === 'inditex' || params.column.colId === 'ecoVero' || params.column.colId === 'joinLife' || params.column.colId === 'bci') {
        return (params.value > 0) ? '<?php echo EXISTS; ?>' : '<?php echo ABSENT; ?>';
    }
    else if (params.column.colId === 'created_date' || params.column.colId === 'updated_date') {
        return moment(params.value).format('DD.MM.YYYY');
    }
    else {
        return params.value;
    }
}

别忘了隐藏的div

<div class="m-content" hidden>
        <div class="row">
            <div class="col-xl-12" id="refreshContent1">
                <div id="myGrid1" class="ag-theme-balham" style="height: 100%;"></div>
            </div>
        </div>
    </div>

经过测试，它适用于服务器端行模型。