当cellNav与Angular JS中的ui-grid一起使用时，修改tab键并输入键行为

Question

我正在使用ui-grid与ui-grid-selection和ui-grid-cellNav模块。 我可以根据documentation中提到的键行为浏览网格。

我想在使用TAB时更改ENTER和cellNav键的行为。

有人可以建议一种方法。

当按下TAB时，我想从网格中失焦。 按下ENTER时，我想打开所选行的超链接。

Answer 1

您可以在gridApi.cellNav.on.viewPortKeyDown功能中更改按键的行为。

$scope.gridOptions = {
    onRegisterApi: function(gridApi) {
        gridApi.cellNav.on.viewPortKeyDown($scope, function (event, newRowCol) {
            if (event.key == 'Tab') {
                event.preventDefault();
                $('.ui-grid-cell-focus').removeClass('ui-grid-cell-focus');
            }
            if (event.key == 'enter')
                event.preventDefault();
       })
   },
   keyDownOverrides: [{
          keyCode: 13,
          ctrlKey: false
      }, //enter
      {
          keyCode: 9,
          ctrlKey: false
      } //tab
   ] 
}

删除ui-grid-cell-focus只会产生视觉效果，但是，使用箭头，您仍然可以转到周围的单元格。如果您不想这样，可以尝试以编程方式更改聚焦元素或阻止其他导航键的默认操作。

我并不完全不知道你在输入时想做什么。