AngularJS ng-table固定标头 [英] AngularJS ng-table fixed headers

问题描述

我正在使用ng-table来显示一些信息.我想固定ng表的页眉和页脚，并强制ng表在行内绘制滚动条.

I'm using ng-table to display some information. I would like to make the header and footer of the ng-table fixed and force the ng-table to draw scroll bars within the rows.

ng-table文档站点上没有有关如何实现此目标的文档.

The ng-table documentation site has no documentation on how to make that happen.

有什么想法吗?

推荐答案

仅使用CSS的解决方案对我有效.只需将table-scroll类添加到表元素和以下CSS:

this CSS-only solution worked for me. Just add the class table-scroll to the table element and the following CSS:

.table-scroll thead {
    display: table;
    width: 100%;
    table-layout: fixed;
}

.table-scroll tbody {
    max-height: 150px;
    overflow-y: auto;
    display: block;
    width: 100%;
    table-layout: fixed;
}

.table-scroll tr {
    display: table;
    table-layout: fixed;
    width: 100%;
}

.table-scroll td {
    height: 47px; // needed in order to keep rows from collapsing
}

这篇关于AngularJS ng-table固定标头的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！