如何将PrimeNg树表中的列组与不可折叠列组合

Question

我使用的是primeng 7.1.3。

我试图创建的是一个scrollable tree table(水平和垂直(，带有：

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

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

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

我找到了一种方法，所以我更新了Stacklitz链接来纠正这个问题如果要查看原始问题，请在app-component.ts文件中注释ngAfterViewInit()。此外，由于上述解决方案，更新了问题的标签。

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

据我所知，它将两组放在第一列的上方，而不是留下empty cell the size of 2 rows-和其他列

树表文档：PrimeNg树表文档

• 列组
• 滚动

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

谢谢。

Answer 1

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

我没有深入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));
}
}

Stacklitz链接，与问题中相同。我将编辑上述问题，以指示如何查看原始问题。

希望它能帮助到一些人，因为关于PrimeNg的问题似乎不多。尽管如此，请记住，此解决方案确实不是一个干净的解决方案。但它节省了我很多时间，所以…