更改角MenuItem中的ui.gird图标

Question

如何按角度切换customizing_column_menu图标，如下图所示

​

​

​

​

Answer 1

我没有找到任何动态更改menuItems的最佳解决方案，以下是我所做的解决办法

码

$scope.gridOptions = {
  rowHeight: 75,
  columnDefs: [{
    field: 'name',
    enableColumnMenu: false
  }, {
    field: 'gender',
    enableHiding: false,
    suppressRemoveSort: true,
    sort: {
      direction: uiGridConstants.ASC
    }
  }, {
    field: 'All Details',
    cellTemplate: '<p ng-show="grid.appScope.company"><label><b>Company:</b></label><span>{{row.entity.company}}</span></p><p ng-show="grid.appScope.email"><label><b>email:</b></label><span>{{row.entity.email}}</span></p>',
    menuItems: [{
      title: 'Company',
      icon: 'ui-grid-icon-ok',
      action: function() {
        $scope.company = $scope.company ? false : true;
      },
      context: $scope,
      shown: function() {
        return this.context.company;
      }
    },{
      title: 'Company',
      icon: 'ui-grid-icon-cancel',
      action: function() {
        $scope.company = $scope.company ? false : true;
      },
      context: $scope,
      shown: function() {
        return !this.context.company;
      }
    }, {
      title: 'Email',
      icon: 'ui-grid-icon-ok',
      action: function() {
        $scope.email = $scope.email ? false : true;
      },
      context: $scope,
      shown: function() {
        return this.context.email;
      }
    }, {
      title: 'Email',
      icon: 'ui-grid-icon-cancel',
      action: function() {
        $scope.email = $scope.email ? false : true;
      },
      context: $scope,
      shown: function() {
        return !this.context.email;
      }
    }]
  }]
};

Working Plunkr