Question

我们在找到如何在ng-grid中创建菜单的方法时遇到了问题。类似于共享点内的ECB块的东西。

因此，单击时会出现一个按钮，显示该特定行的选项。

我们可能会找错地方，但我们在互联网上找不到任何帮助或示例..

Answer 1

正如我几天前告诉你的那样，你应该使用行和模板来实现这样的目标。

以下是更改后的代码，以便更好地匹配您问题的当前状态：

    $scope.gridOptions = {
    data: 'myData',
    rowTemplate: '<div   ng-style="{\'cursor\': row.cursor, \'z-index\': col.zIndex() }" ' +
      'ng-repeat="col in renderedColumns" ng-class="col.colIndex()" ' +
      'class="ngCell {{col.cellClass}}" ng-cell></div>' +
      '<div ng-show="showmenu" class="hmenu">' +
      '<ul>' +
      '<li><button ng-click="viewme(row.entity.name)">View</button></li>' +
      '<li><button ng-click="editme(row.entity.name)">Edit</button></li>' +
      '</ul>' +
      '</div>',
    columnDefs: [{
      field: 'name',
      displayName: 'Name'
    }, {
      field: 'age',
      displayName: 'Age',
      cellTemplate: '<div class="ngCellText">{{row.getProperty(col.field)}}' +
        '<span  ng-click="$parent.showmenu=!$parent.showmenu"><button>click me</button></span>' +
        '</div>'
    }]
    };

没错，这不是美，但它告诉你如何继续。在style.css和行模板中进行样式设置。这是我用周末笔记本电脑做的最好的。

Here is the Plunker

Answer 2

您可以将每个CellTemplate设置为具有自己的ng-if / ng-show块，该块根据row.entity对象上的变量隐藏/显示。然后，当您的函数触发选择行时，您可以设置该变量（$scope.whatever）以隐藏/显示必要的内容。在我的手机上，但我会稍后尝试制作一个plnkr / jsfiddle。

如何在ng-grid中创建菜单

2 个答案: