Kendo ui 剑道网格不分页本地数据

我正试图弄清楚如何使用本地数据进行分页。目前我有一个数据源：

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>

---

我遗漏了什么？

以下是它无法按预期工作的原因：

由于数据源是本地的，

serverPaging

应该设置为false（因为没有对服务器的调用）

pageSize

不是

grid

的一个选项，而是

grid.pageable的一个选项

不要忘记设置

页面大小

，无论是在客户端还是服务器端执行分页。可以在

pageable

设置或

dataSource

设置中定义

pageSize

如果已存在的

数据源

实例被传递到网格，则应在数据源的设置中设置

页面大小

选项，而不是在

可分页

设置中设置

综上所述：

vm.kendoData=new kendo.data.DataSource({
服务器分页：false，
页面大小：5，
数据：$scope.records
});
vm.gridOptions={
栏目：[
{
字段：“Col1”，
标题：“Col1”，
宽度：“120px”
}, {
字段：“Col2”，
标题：“Col2”，
宽度：“120px”
}, {
字段：“Col3”，
标题：“Col3”，
宽度：“120px”
}, {
字段：“Col4”，
标题：“Col4”，
宽度：“120px”
}
],
pageable:对，
数据绑定：函数（）{
this.expandRow（this.tbody.find（“tr.k-master-row”）.first（））；
}
}

我制作了一把小提琴来演示：

---

注意：既然您已经在从服务器获取数据，为什么不在服务器上创建一个带有分页的远程数据源呢

添加数据示例如果您已经从服务器获取数据，为什么不在服务器上创建一个带分页的远程数据源？我将此标记为accepted asnwer，因为这为我指明了正确的方向，感谢您的解释！我所要做的是在获取数据的函数中初始化数据源，我的失败。

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());
        }
    }