Question

我们在Angular 5 / Bootstrap 4 Web应用程序（Windows 10桌面）中使用了ag-grid。

"ag-grid": "^17.1.1",
"ag-grid-angular": "^17.1.0",

当用户按下搜索按钮时，结果是一个行列表，这些行在我们的ag-grid表中很好地显示。第一列行是实现ICellRendererAngularComp的单元格渲染器，所有内容均已正确渲染。这是渲染器的模板：

<span>
    <button (click)="viewDetails()" class="btn btn-primary btn-sm"><i class="fa fa-eye" style="font-size: 12px"></i>
    </button>
</span>

当用户按下Tab键进入表格及其第一个单元格/行时，可以看到该单元格周围的焦点（1像素的蓝色实线边框），并且按钮上的焦点边框也可见-这些是都正确。

问题在于用户按下“搜索”按钮后，我们需要以编程方式选择第一行/第一个单元格。目前，我们通过

let firstRowNode = this.gridOptions.api.getDisplayedRowAtIndex(0);
let params = { columns: ['0'], rowNodes: [firstRowNode] };
let instances = this.gridOptions.api.getCellRendererInstances(params);
if (instances.length > 0) {
  // got it, user must be scrolled so that it exists
  let instance: any = instances[0];
  this.gridOptions.api.setFocusedCell(0, '0', null);
}

setFocusedCell仅将（1像素的纯蓝色）边框放在单元格周围，而不是在呈现的按钮周围。

也尝试执行以下操作，但甚至不要在单元格周围放置1像素的蓝色边框：

let firstChild = frameworkInstance.params.eGridCell.childNodes[0].firstElementChild.firstChild;
firstChild.autofocus = true;
firstChild.focus();

任何方向/帮助都将不胜感激。

谢谢吉姆

ag-grid和setFocusedCell和508合规性

0 个答案: