Question

我试图找到解决方法来修复dataTable高度。

该表添加了分页。将页面更改为第二页，其中行数较低，如初始页面（在我们的第一页中），dataTable高度将更改。

Answer 1

对我而言，它使用了以下css语句：

::ng-deep .ui-datatable-scrollable-view .ui-datatable-scrollable-body {
    min-height: 400px;
    border: 1px solid #D5D5D5;
}

:: ng-deep targets inside primeNg元素＆lt; p-dataTable＆gt; 。 ui-datatable-scrollable-body 类的最小高度：0px将被覆盖所需的最小高度。

使用两个css选择器代替一个css选择器来增加css选择器的特异性。

我创建了以下的plunker来说明它是如何工作的。

https://plnkr.co/edit/8cFrCY?p=preview

Answer 2

我也像前面提到的那样添加了虚拟行，但是当我使用primeng的globalfilter时，该问题再次发生，因此提供的解决方法如下：

在我的component.ts中，我有两个函数addRecordsForPagination和removeFunc

datatable是primeng表的子视图。

import threading
import time

class Counter():
    def __init__(self, increment):
        self.next_t = time.time()
        self.i=0
        self.done=False
        self.increment = increment
        self.run()

    def run(self):
        print("hello ", self.i)
        self.next_t+=self.increment
        self.i+=1
        if not self.done:
            threading.Timer( self.next_t - time.time(), self.run).start()

    def stop(self):
        self.done=True

a=Counter(increment = 1)
time.sleep(5)
a.stop()

Answer 3

对于Primeng p表，我在styles.scss中设置了最小高度，它解决了类似的问题。

.your_table_name .ui-table-scrollable-body  {
  min-height: 300px !important;
}

PrimeNG - 按行数设置的p-dataTable高度

3 个答案: