动态添加（选择/取消选择）数据网格Kendo UI

Question

我刚开始使用kendo UI网格，我能够弄清楚如何将kendo与angularJS集成

Ex：JSFIDDLE

但是我试图实现一些事情，比如动态添加/选择或取消选择列名，然后数据网格应该在数据表中相应地显示列。

Ex：

现在，当我在网格右侧选择一个新列时，数据表将使用所选列进行更新

希望这张图片清楚地说明我指的是什么

所以，我想实现这种动态数据网格，

即使我做了

columns: [
            { field: "lastName", title: "Last Name" },
            { field: "firstName", title: "First Name" },
            { field: "company", title: "Company"},
            { field: "title", title: "Title" },
            { field: "email", title: "Email" },
            { field: "phone", title: "Phone" }
        ],

和dataSource动态它无法正常工作。

注意：请考虑从API获取列名称，因此我需要基于API动态实现

Answer 1

用于显示/隐藏列，我们在Grid本身上公开了方法。以下是这些的API参考：

showColumn - http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#methods-showColumn

hideColumn - http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#methods-hideColumn

此外，我们还有一个名为ColumnMenu的功能。它会自动提供一个列菜单，您可以在其中选中/取消选中要显示或隐藏的列。这是一个演示：http://demos.telerik.com/kendo-ui/grid/column-menu

希望这会有所帮助