使用表格内的箭头移动时滚动到选定的行

时间:2019-07-07 22:12:21

标签: angular material

我有一个表格(mat-table),可以在其中使用上下箭头键在各行中滚动,但滚动不会移动到所选行,并且从视图中隐藏起来

使用此功能,我可以按以下键移动:

keydown(event: KeyboardEvent) {
    if (!this.multipleCell) {
      event.preventDefault();
      let currentIndex = this.data.data.findIndex(row => row.data === this.selectedObject);
      let newSelection = -10;
      if (event.key === 'ArrowDown') {
        this.data.data.forEach((row, index) => {
          if (newSelection == -10 && index > currentIndex && row.rowType == RowType.ROW)
            newSelection = index;
        });
      }
      if (event.key === 'ArrowUp') {
        currentIndex = this.data.data.length - currentIndex - 1;
        this.data.data.reverse().forEach((row, index) => {
          if (newSelection == -10 && index > currentIndex && row.rowType == RowType.ROW)
            newSelection = index;
        });
        this.data.data.reverse();
        if (newSelection != -10) {
          newSelection = this.data.data.length - newSelection - 1;
        }
      }
      if (newSelection != -10) {
        this.selectedObject = this.data.data[newSelection].data;
      }

    }
  }

0 个答案:

没有答案