我希望 TurboTable 占据整个父级的高度（并在调整父级大小时调整大小），因此只有表格的内容是可滚动的，并且没有向父级组件添加滚动条。
我已尝试设置 scrollHeight="100%"，但无法按预期工作：https://stackblitz.com/edit/angular-d9narm。
有什么想法吗？
更新：正如@phucnh 更正的那样，我应该使用 scrollHeight="calc(100% - 200px)" 来补偿我的填充。我现在更新了我的 stackblitz 以反映这一点。这在第一次加载窗口时非常有效，但如果您尝试更改它的高度，表格的高度不会改变。
【问题讨论】：
标签： primeng primeng-turbotable
在 CSS 中，你设置了padding: 100px，所以你需要设置scrollHeight="calc(100% - 200px)"
如果要在调整大小时更新高度，则需要处理更多。我建议一个演示 here
【讨论】：
因此，在 @phucnh 的帮助和谷歌搜索之后，我能够生成允许 TurboTable 采用其所有父大小并正确显示/隐藏滚动条的代码：
https://stackblitz.com/edit/primeng-scrollable-table-fit-parent
基本上，它包含两个 hack：
1）我们需要观察父尺寸的变化，并通过这段代码强制Angular重新评估“scrollHeight”：
ngAfterViewInit(): void {
new ResizeObserver(() => this.zone.run(() => this.onResize()))
.observe(this.container.nativeElement);
}
private onResize(): void {
// HACK: mark "scrollHeight" dirty, so it's re-evaluated.
if (this.table.scrollHeight.endsWith(' ')) {
this.table.scrollHeight = this.table.scrollHeight.slice(0, -1);
} else {
this.table.scrollHeight += ' ';
}
}
2) 为了解决在滚动条出现/消失时标题单元格不对齐的问题，我们需要进行一些肮脏的修改（受https://stackblitz.com/edit/primeng-dynamic-scrollable 启发）：
// HACK: automatically re-align table header when resized. Borrowed the idea from https://stackblitz.com/edit/primeng-dynamic-scrollable
const scrollableViewNgAfterViewInit = ScrollableView.prototype.ngAfterViewInit;
ScrollableView.prototype.ngAfterViewInit = function() {
scrollableViewNgAfterViewInit.call(this);
new ResizeObserver(() => {
this.alignScrollBar();
}).observe(this.scrollBodyViewChild.nativeElement);
};
成功了。
更新（2020 年 6 月 6 日）：
最近，此解决方法的第 2 部分停止工作。我假设发生这种情况是因为 Angular 现在缓存了指向生命周期事件的指针。因此，覆盖它们什么都不做，并且被覆盖的方法不会被触发。
// HACK: automatically re-align table header when resized. Borrowed the idea from https://stackblitz.com/edit/primeng-dynamic-scrollable
const bindEventsOriginal = ScrollableView.prototype.bindEvents;
ScrollableView.prototype.bindEvents = function (): void {
bindEventsOriginal.call(this);
new ResizeObserver(() => {
this.alignScrollBar();
}).observe(this.scrollBodyViewChild.nativeElement);
};
此外，PrimeNG 9.1.0 版添加了 scrollHeight="flex" ，这基本上使此解决方法的第 1 部分变得不必要。
【讨论】：
turboTable 组件有问题。
这两个 hack 解决了这个问题，但它们只在 Chrome 中运行良好。我尝试在 Firefox 和 Edge 中使用它，但两个浏览器都冻结了。我想是因为 ResizeObserver 是目前这两个浏览器都不支持的功能。
【讨论】：