如何通过键盘导航将焦点集中到AG-Grid行组件上

Question

如果我聚焦于Ag-Grid行以外的元素，则无法使用键盘导航Ag-Grid。

为了解决这个问题，在执行按钮点击后，我需要重新将焦点聚焦回Ag-Grid行元素。

我尝试了以下方法来聚焦于Ag-Grid行，但仍然不起作用。

最初的回答：

this.elElement.nativeElement.querySelectorAll('.ag-row').attr('tabindex', -1).focus();

我应该能够在按钮点击后重新聚焦到AG-Grid，以便可以使用Ag-Grid的键盘导航。"Original Answer"的翻译是"最初的回答"。

- Wong Hung Lui

Answer 1

您可以使用 ag-grid 的 setFocusedCell() API 来聚焦单元格。

// scrolls to the first row
gridOptions.api.ensureIndexVisible(0);

// scrolls to the first column
var firstCol = gridOptions.columnApi.getAllDisplayedColumns()[0];
gridOptions.api.ensureColumnVisible(firstCol);

// sets focus into the first grid cell
gridOptions.api.setFocusedCell(0, firstCol);

在此处阅读更多文档- https://www.ag-grid.com/javascript-grid-api/#navigation和https://www.ag-grid.com/javascript-grid-keyboard-navigation/

- abd995