如何从 Angular 控制器在 kendo-grid 上调用 refresh()？

Question

我正在尝试遵循一些关于刷新 kendo 网格的建议，例如 this。

关键是 html 我有：

<div kendo-grid="vm.webapiGrid" options="vm.mainGridOptions">

然后在控制器中我有：

vm.webapiGrid.refresh();

注意：我使用的是 ControllerAs 语法，所以我使用的是 "vm" 而不是 $scope。

我的问题是 "vm.webapiGrid" 未定义。这看起来很简单，但我不确定为什么它是未定义的。

Answer 1

将 id 添加到网格并尝试使用它刷新。

<div kendo-grid="vm.webapiGrid" options="vm.mainGridOptions" id="grid1">

在控制器中使用这个：

$("#grid1").data('kendoGrid').refresh();

Answer 2

找到答案了。我读到的另一种刷新数据源的方法是做类似的事情：

vm.mainGridOptions.datasource.transport.read();

这对我不起作用，因为 "read" 未定义。查看我的数据源定义，我明白了原因，读取需要一个参数（在本例中 "e"）：

    vm.mainGridOptions = {
        dataSource: {
            transport: {
                read: function (e) {
                    task.getAllTasks(vm.appContext.current.contextSetting).
                        then(function (data) {
                            e.success(data);
                        });
                },
            }
        },

为了解决，我将"e"保存在我的范围内，然后在我想刷新时重新使用它：

    vm.mainGridOptions = {
        dataSource: {
            transport: {
                read: function (e) {
                    task.getAllTasks(vm.appContext.current.contextSetting).
                        then(function (data) {
                            e.success(data);
                            vm.optionCallback = e;
                        });
                },
            }
        },

然后：

if (vm.optionCallback !== undefined) {
   vm.mainGridOptions.dataSource.transport.read(vm.optionCallback);
}

问题已解决（我希望）。

Answer 3

因为您使用的是选项对象来触发读取，您应该改用网格引用：

<div kendo-grid="vm.webapiGrid" options="vm.mainGridOptions">

如：

$scope.vm.webapiGrid.dataSource.transport.read();

希望对您有所帮助。

如何从 Angular 控制器在 kendo-grid 上调用 refresh()？

How to call refresh() on a kendo-grid from an Angular controller?

kendo-ui

angularjs

kendo-grid