Question

我需要一个单元格可编辑表，键盘导航将跳过某些单元格，但是如果用户单击它们，我需要这些单元格是可编辑的。

共有3栏。当用户从列的最后一个可编辑字段中跳出时，我要添加新行，并将编辑器放在新行的第3个可编辑列中。跳过第1行和第2行。但是他们仍然可以返回并对其进行编辑。

我尝试过使用tabindex，但是它什么也没做。
我尝试以viewChildren的身份访问editableColumns，但直到选项卡处理程序之后，这种新行的可编辑列才真正存在。
也已经注意到，使用editableColumn.openCell（）可以完成某些工作，但是随后表格的样式变得很有趣，并且单元格并不是真正的焦点。

任何有关如何使用prime-ng表API完成此操作的提示将不胜感激。

Answer 1

您可以在第三列的input模板上处理keydown事件，像这样

<ng-template pTemplate="input">
<input pInputText type="text" [(ngModel)]="rowData.field_3" (keydown.tab)="onTabPress($event, i)">
</ng-template>

然后在ts文件中，通过最简单的方法或您自己的方式

将新行添加并聚焦到第三个单元格

onTabPress(e, i) {
    if (i == this.data.length - 1) {
      this.data.push({
        field_1: '',
        field_2: '',
        field_3: ''
      });
      setTimeout(() => {
        $('tr').eq(i + 2).find('td').eq(2).click();
      });
    }
  }

我创建了一个演示here。希望有帮助

如何使Tab键跳过prime-ng

1 个答案: