使用 angular ui-grid 时如何在单击单元格时定位自定义上下文菜单？

Question

我正在使用 angular-ui-grid 中的以下代码，使用 http://ui-grid.info/

我的网格选项如下：

$scope.gridOptions = {
            enableSelectAll: true,

            enableFiltering: true,
            showGridFooter: true,
            paginationPageSizes: [10, 25, 50, 75],
            paginationPageSize: 10,
            useExternalPagination: true,
            enableGridMenu: false,
            columnDefs: [
                { name: 'materialnum', displayName: 'Part Number', cellClass: 'partNum', cellTemplate: "<div> <div ng-click='grid.appScope.cellClicked(row,col)' class='ui-grid-cell-contents' title='TOOLTIP'>{{COL_FIELD CUSTOM_FILTERS}}</div><div class='subMenu' ng-show='menu'><div class='subMenuChld'><span class='arrwLeft'></span><h5>View Details</h5><ul><li ng-click='menuItemClick(parts)'>New Price</li><li ng-click='menuItemClick(parts)'>Usage/Forecast</li><li ng-click='menuItemClick(parts)'>Inventory</li><li ng-click='menuItemClick(parts)'>Part BOM</li><li ng-click='menuItemClick(parts)'>Open Order</li><li ng-click='menuItemClick(parts)'>Open PO</li><li ng-click='menuItemClick(parts)'>Return History</li><li ng-click='menuItemClick(parts)'>Supplier History</li><li ng-click='menuItemClick(parts)'>Repair History</li><li ng-click='menuItemClick(parts)'>Alternative Parts</li></ul></div></div></div>"},
                { name: 'materialdesc', displayName: 'Part Description', },
                {
                    name: 'sparable', displayName: 'Sparable'
                },

.. .

还处理了点击以显示单元格模板中的菜单：

$scope.menu = false;

$scope.cellClicked = function (row, col){

                console.log(row.entity.materialnum);
                $scope.menu = true;
            }

当我们点击网格上的行时，菜单没有出现。

需要如何显示它的建议。

#

编辑

#

我得到了访问网格范围内部的答案，但现在我无法为每行单击定位上下文菜单。怎样才能让位置精确到网格上的点击

Answer 1

始终在 ui-grid 模板中的变量之前使用 grid.appScope。

必须是 ng-show='grid.appScope.menu' 而不是 ng-show='menu'。为此检查所有元素。