AngularJS ui-grid 在使用 enableFullRowSelection 时将列排除在 select 行之外

Question

有没有办法将列排除在 select 行之外？在下面的示例中，我想让年龄列无法 select 该行。

http://plnkr.co/edit/OFoJydRpzoKAGBw3Tfzw?p=preview

  $scope.gridOptions = { enableFullRowSelection: true, enableRowHeaderSelection: false };

  $scope.gridOptions.columnDefs = [
    { name: 'id' },
    { name: 'name'},
    { name: 'age', displayName: 'Age (not focusable)', allowCellFocus : false },
    { name: 'address.city' }
  ];

  $scope.gridOptions.multiSelect = false;
  $scope.gridOptions.modifierKeysToMultiSelect = false;
  $scope.gridOptions.noUnselect = true;
  $scope.gridOptions.onRegisterApi = function( gridApi ) {
    $scope.gridApi = gridApi;
       gridApi.selection.on.rowSelectionChanged($scope,function(row){
        var msg = 'row selected ' + row.isSelected;
        $scope.callMe(row.entity);
      });
  };

Answer 1

尝试使用自定义 cellTemplate，您可以在其中以自定义方式处理单元格点击（忽略点击，或立即取消选择行）。

Answer 2

如前所述，您需要使用自定义单元格模板并禁用事件传播。按照您的代码，单元格模板应为：

cellTemplate: '<div class=\"ui-grid-cell-contents\" ng-click="$event.stopPropagation()">{{row.entity.age}}</div>'

请看这个笨蛋http://plnkr.co/edit/BsmtzMQ9nNyWcSVuZDu4?p=preview

AngularJS ui-grid 在使用 enableFullRowSelection 时将列排除在 select 行之外

AngularJS ui-grid Exclude column from being able to select row when using enableFullRowSelection

angularjs

angular-ui-grid