javascript - Kendo 网格聚合仅适用于当前页面

Question

我在使用 Kendo Grid 聚合函数时遇到问题，但似乎无法解决。

我有许多行包含数值。在网格的底部，我想显示行的总和。

这已经可以正常工作，如这个 fiddle 所示:

http://jsfiddle.net/0Ly94e49/

$(document).ready(function () {
$("#grid").kendoGrid({
    dataSource: {
        type: "odata",
        transport: {
            read: "http://demos.kendoui.com/service/Northwind.svc/Products"
        },
        pageSize: 7,

        aggregate: [{
            field: "ProductName",
            aggregate: "count"
        }, {
            field: "UnitPrice",
            aggregate: "sum"
        }, {
            field: "UnitsOnOrder",
            aggregate: "sum"
        }, {
            field: "UnitsInStock",
            aggregate: "min"
        }, {
            field: "UnitsInStock",
            aggregate: "max"
        }]
    },
    sortable: true,
    scrollable: false,
    pageable: true,
    columns: [{
        field: "ProductName",
        title: "Product Name",
        footerTemplate: "Total Count: #=count#",
    }, {
        field: "UnitPrice",
        title: "Unit Price"
    }, {
        field: "UnitsOnOrder",
        title: "Units On Order",
        footerTemplate: "Sum: #=sum#",
    }]
});
});

问题在于，正如 fiddle 中一样，总和适用于所有页面上的所有行。我想要的只是当前页面上的行的总和。

有什么想法可以改变 fiddle 来做到这一点吗？

该项目是用 Angular 编写的，如果这有什么区别的话。

提前谢谢您。

Answer 1

我对这种情况的成就。我写了一个聚合:

dataSource: {
                        data: dataOfTable,
                        aggregate: [
                            {field: "field1", aggregate: "sum"},
                            {field: "field2", aggregate: "sum"},
                            {field: "field3", aggregate: "sum"}
                        ],
                        pageSize: 20
                    },

列的页脚模板:

    {
 field: "field1",
 title: 'Field1',
 footerTemplate: "#=getCurrentField1()#"    
 }

对于 field2、field3 等:

{
 field: "field2",
 title: 'Field2',
 footerTemplate: "#=currentField2#"    
 }

函数 getCurrentField1:

//  aggregates data on current page
            var currentField1 = 0;
            var currentField2 = 0;
            var currentField3 = 0;

            function getCurrentField1() {

                var displayedData = $("#grid").data().kendoGrid.dataSource.view()

                var resField1 = 0;
                var resField2 = 0;
                var resField3 = 0;

                for (var i = 0; i <= displayedData.length; i++) {
                    if (displayedData[i] != undefined) {
                        resField1 += displayedData[i].field1;
                        resField2 += displayedData[i].field2;
                        resField3 += displayedData[i].field3;
                    }
                }

                currentField1 = resField1;
                currentField2 = resField2;
                currentField3 = resField3;
                return currentPayAmount;
            }

使用 dataBound 分页无法正常工作。 footerTemplates 中的当前数据不正确，因为绑定(bind)是在设置 footerTemplates` 值后进行的。因此，我在第一列中添加了一个函数，用于评估所有当前值并正确设置它。