AngularJS中的Kendo UI Grid Persist状态

2023年2月13日 232次阅读

我在Angular中加载网格的已保存状态时遇到一些问题.

这是网格HTML：

<div id="grid" kendo-grid k-options="GridOptions" k-ng-delay="GridOptions"></div>

后来我启动了我的Http调用,并填写了$scope.GridOptions,网格工作正常.

然后我这样保存我的网格状态：

$scope.GridOptionsBackup = kendo.stringify($scope.GridOptions);

这工作正常,当我在控制台中打印输出.它看起来像这样：

{“dataSource”:{“schema”:{“data”:”Data”},”transport”:{},”serverSorting”:true,”table”:null,”fields”:[{“encoded”:true,”field”:”WidgetName”,”title”:”Name”,”template”:”#: data.WidgetName#”},{“encoded”:true,”field”:”WidgetDescription”,”title”:”Description”,”template”:”#: data.WidgetDescription#”}]},”columns”:[{“field”:”WidgetName”,”title”:”Name”,”template”:”#: data.WidgetName#”},{“field”:”WidgetDescription”,”title”:”Description”,”template”:”#: data.WidgetDescription#”}],”sortable”:{“mode”:”multiple”,”allowUnsort”:true},”scrollable”:true}

当我尝试使用保存的状态重新加载网格时,我读取了JSON,解析它并将其重新分配给$scope.GridOptions.但这不起作用：

$scope.GridOptions = JSON.parse($scope.GridOptionsBackup);

为什么在这行代码之后网格没有更新？

我非常感谢您提供的任何帮助！

最佳答案 我找到了答案：

我不得不给kendo-grid一个名字：

<div kendo-grid="GridBram" k-options="GridOptions" k-ng-delay="GridOptions"></div>

在我的Angular代码中,名称会自动绑定到范围.在那里我可以使用jQuery中使用的相同(奇怪)get和setOptions方法.我还使用var来存储JSON.

这是我的代码：

var savedState = null;

$scope.saveO = function () {
    savedState = kendo.stringify($scope.GridBram.getOptions());
    console.log(test);
}

$scope.loadO = function () {
    $scope.GridBram.setOptions(JSON.parse(savedState));
}

像这样,你可以在Angular中保存和加载你的网格状态！

点赞