Kendo Grid:在Kendo Grid启动后更新列配置

Ton*_*ong 1 kendo-ui angularjs kendo-grid

请看这个例子

我希望在kendo网格启动后更新列.

例如,当前列定义如下:

             columns: [{
                field: "FirstName",
                title: "First Name",
                width: "120px"
                },{
                field: "LastName",
                title: "Last Name",
                width: "120px"
                },{
                field: "Country",
                width: "120px"
                },{
                field: "City",
                width: "120px"
                },{
                field: "Title"
            }]
Run Code Online (Sandbox Code Playgroud)

在显示网格后,我想更新列的定义,如下所示:

             var newCol = [{
                field: "FirstName",
                title: "You First Name",
                width: "200px"
                },{
                field: "LastName",
                title: "You Last Name",
                width: "200px"
                },{
                field: "Title"
            }]
Run Code Online (Sandbox Code Playgroud)

我想要这个功能,因为它允许用户动态地改变整个网格.不仅是dataSource,还有列.他们可以选择重置宽度,标题.他们可以选择查询他们想要的数据,并使用自定义列配置将其呈现在网格中.

我知道我可以摧毁网格然后创建另一个网格,但这可能没有必要,对吧?任何帮助表示赞赏.

谢谢.

dfs*_*fsq 5

所有你需要获得对kendoGrid实例的引用的拳头.为此,您需要在模板中命名指令,例如:

<div kendo-grid="grid" options="mainGridOptions"></div>
Run Code Online (Sandbox Code Playgroud)

所以你的范围$scope.grid将是网格实例.然后你可以使用普通的网格方法,如hideColumn:

$scope.grid.hideColumn(2); // hide the second column
Run Code Online (Sandbox Code Playgroud)

演示: http ://dojo.telerik.com/iyuZE/5