0

我正在使用primeng 7.1.3.

我要创建的是一个scrollable tree table（水平和垂直）：

  • 第一个column not scrollable
  • 2groups of column不包括第一个

我设法得到了这样的东西：StackBlitz code。

编辑开始------------------------------------------------------------ ----

我找到了解决方法，因此我更新了 Stackblitz 链接以纠正问题。如果您想查看原始问题ngAfterViewInit()，请在app-component.ts文件中添加注释。由于上述解决方案，还更新了问题的标签。

编辑结束------------------------------- --------

据我了解，它将两组放在第一列之上- 而不是留下empty cell the size of 2 rows- 和其他列应该是。

树表文档：PrimeNg 树表文档

关于如何解决这个问题的任何提示？

谢谢。

4

1 回答 1

0

所以我想出了一个解决方案，但它不是很干净。

我没有深入研究 PrimeNg 框架并修改其代码，而是决定使用ngAfterViewInit并处理生成的 DOM。从这里，我只是寻找不应该在这里的单元格并将它们删除。我还更新了空单元格的高度。

以下是 中使用的函数ngAfterViewInit()：

correctDOM(): void {
  function cleanFixedHeader(tagName: string, element: Element): Element {
    const listElementsByTagName = element.getElementsByTagName(tagName);

    if (listElementsByTagName.length === 0) {
      return null;
    }

    for (let i = 0; i < listElementsByTagName.length - 1; i++) {
      element.removeChild(listElementsByTagName[i]);
    }
    return listElementsByTagName[listElementsByTagName.length - 1];
  }

  const treeTableFixedHead: Element = this.elRef.nativeElement
                                  .getElementsByClassName('ui-treetable-frozen-view')[0]
                                  .getElementsByClassName('ui-treetable-thead')[0];

  const treeTableFixedRow = cleanFixedHeader('TR', treeTableFixedHead);
  if (treeTableFixedRow !== null) {
    const treeTableFixedHeaderCell = cleanFixedHeader('TH', treeTableFixedRow);
    treeTableFixedHeaderCell.setAttribute('height', String(treeTableFixedHeaderCell.getBoundingClientRect().height * 2));
  }
}

Stackblitz link，与问题中的相同。我将编辑所述问题以指示如何查看原始问题。

希望它会对某人有所帮助，因为关于 PrimeNg 的问题似乎并不多。不过，请记住，这个解决方案确实不是一个干净的解决方案。但它为我节省了很多时间，所以...

于 2020-02-18T17:16:52.640 回答