使用AngularJs的Kendo Grid中的工具栏列菜单

Question

我正在尝试使用Kendo网格工具栏中的Kendo ui-Menu，如下所示： 我能够使用JQuery工作（这是一个有效的Fiddle，但我需要让它在Angular中工作。

我尝试在网格的数据绑定功能中使用它：

localhost/food/

然后在控制器中：

              for (var i = 0, max = $scope.SearchGrid.columns.length; i < max; i++) {
              ds.push({
                  encoded: false,
                  text: "<label><input type='checkbox' checked='checked' " +
                      " class='check' data-field='" +
                      $scope.SearchGrid.columns[i].field +
                      "</label>"
              });

          }

我在工具栏中有这样的内容：

 $scope.menuDataSource = [
{
    text: "Edit Columns",
    items: ds

}]; 

但菜单在“ds”中有任何内容之前呈现，我无法弄清楚如何在菜单上调用类似toolbar: [ { name: "Edit Columns", template: '&nbsp;&nbsp;&nbsp;<div class="k-button btn btn-default btn-xs" style="float: left" kendo-menu k-data-source="menuDataSource"></div>' } ], 的内容。我认为必须有办法做到这一点，但对于我的生活，我无法弄明白。非常感谢任何帮助！

Answer 1

因此，您希望在网格渲染后在kendoMenu中设置项目，但在网格工具栏中使用kendoMenu。最佳解决方案是在网格读取数据后在菜单dataSource中设置新项目。您可以使用setOptions的dataSource kendoMenu方法，例如：

$('div[kendo-grid="SearchGrid"] .k-menu').data('kendoMenu').setOptions({dataSource: $scope.menuDataSource});

检查此示例 - 我将Item2添加到dataSource并在kendoMenu中设置：http://dojo.telerik.com/OnAXI/2