Question

我试图找出如何使用本地数据进行分页工作。目前我有一个DataSource：

vm.kendoData = new kendo.data.DataSource({
        serverPaging: true,
        pageSize: 5
    });

当我从服务器获取数据时，它被分配到DS：

vm.kendoData.data = $scope.records;

以下是网格标记：

<kendo-grid data-source="vm.kendoData.data" options="vm.gridOptions"><kendo-grid>

这是选项定义：

vm.gridOptions = {
        columns: [
            {
                field: "Col1",
                title: "Col1",
                width: "120px"
            }, {
                field: "Col2",
                title: "Col2",
                width: "120px"
            }, {
                field: "Col3",
                title: "Col3",
                width: "120px"
            }, {
                field: "Col4",
                title: "Col4",
                width: "120px"
            }
        ],
        pageSize: 10,
        pageable: true,
        dataBound: function () {
            this.expandRow(this.tbody.find("tr.k-master-row").first());
        }
    }

我错过了什么？

Answer 1

这就是为什么它不能按预期运作的原因：

由于您的数据源是本地的，因此serverPaging应设置为false（因为没有对服务器的调用）
pageSize不是grid的选项，可以选择grid.pageable，but the documentation states：

不管是在客户端还是服务器端执行分页，都不要忘记设置pageSize。可以在pageSize设置或pageable设置中定义dataSource。 如果已将现有datasource实例传递到网格，则应在dataSource的设置中设置pagesize选项，而不是pageable设置。< / p>

总结一下：

vm.kendoData = new kendo.data.DataSource({
    serverPaging: false,
    pageSize: 5, 
    data: $scope.records
});

vm.gridOptions = {
    columns: [
        {
            field: "Col1",
            title: "Col1",
            width: "120px"
        }, {
            field: "Col2",
            title: "Col2",
            width: "120px"
        }, {
            field: "Col3",
            title: "Col3",
            width: "120px"
        }, {
            field: "Col4",
            title: "Col4",
            width: "120px"
        }
    ],
    pageable: true,
    dataBound: function () {
        this.expandRow(this.tbody.find("tr.k-master-row").first());
    }
}

我创造了一个小提琴演示：https://jsfiddle.net/86w9u27h/7/

注意：由于您已经从服务器获取数据，为什么不在服务器上创建带分页的远程数据源？

Kendo-grid不会分页本地数据

1 个答案: