使用自定义 transport.read 方法的网格远程数据虚拟化？

Question

我想将 Kendo 网格与远程数据虚拟化一起使用。我还需要 transport.read 属性.

的自定义方法

我的网格是这样配置的：

$(document).ready(function () {
                $("#grid").kendoGrid({
                    dataSource: {
                        serverPaging: true,
                        serverSorting: true,
                        pageSize: 100,
                        transport: {
                            read: function (options) {

                                // Get the template items, which could be products, collections, blogs or articles
                                getTemplateItems().then(function (data) {

                                    options.success(data);
                                });
                            }
                        }
                    },
                    schema: {
                      total: function(response) {

                          return 2000;
                      }  
                    },
                    height: 543,
                    scrollable: {
                        virtual: true
                    },
                    sortable: true,
                    columns: [
                                     { field: "title", title: "Title" }
                    ]
                });
            });


            function getTemplateItems() {

                var deferred = $q.defer();

                smartseoEntityMapping.getEntityInfo({ mappedEntityType: mappedEntityType.Product }).$promise.then(function (data) {

                    deferred.resolve(data);
                });

                return deferred.promise;
            }

问题是 read 方法只在初始化网格时被调用一次。当滚动到达当前可见集合中的最后一项时不会调用它。

我怀疑网格需要项目总数，但我不明白如何设置项目总数。为 schema.total 属性设置方法不起作用，因为该方法从未被调用。

所以我想问你，这种情况是否可能，让虚拟化与自定义 transport.read 方法一起工作，每次都需要调用它来获取下一页数据？

为什么我要使用自定义阅读？好吧，我不能只为 transport.read 属性设置一个 url，因为我的远程调用是通过 angularjs 资源进行的，涉及设置身份验证等...

Answer 1

架构是 kendo 数据源的属性。看起来您在数据源之外拥有它。

应该是：

$("#grid").kendoGrid({
                dataSource: {
                    serverPaging: true,
                    serverSorting: true,
                    pageSize: 100,
                    transport: {
                        read: function (options) {

                            // Get the template items, which could be products, collections, blogs or articles
                            getTemplateItems().then(function (data) {

                                options.success(data);
                            });
                        }
                    },
                    schema: {
                      total: function(response) {

                          return 2000;
                      }  
                   }
                },

                height: 543,
                scrollable: {
                    virtual: true
                },
                sortable: true,
                columns: [
                                 { field: "title", title: "Title" }
                ]
            });

使用自定义 transport.read 方法的网格远程数据虚拟化？

Grid remote data virtualization with custom transport.read method?

telerik

kendo-ui

kendo-grid