向 PrimeNG 表添加新行时，分页不会刷新

Question

在这个简单的stackblitz中，只有4个初始行，分页部分只显示1页。现在，当我在每3秒后动态添加行时，无论我添加了多少行，分页部分都会显示一个页面。如何保持分页与表数据同步？

Answer 1

由于数组是通过引用传递的，即使我们添加了引用不变的新数据，也可以尝试使用spread运算符向数组添加新值。

setInterval(() => {
const newData = {
albumId: 25000,
id: 24000,
title: 'zaalim haakim',
url: 'google.com',
thumbnailUrl: 'google.com',
};
this.products = [...this.products,newData];
}, 3000);

或

正如@Arnaud Denoylle在评论中提到的，您可以使用Viewchild来获取表实例，并对其调用reset来更新paginator状态

@ViewChild(Table) table: Table;
setInterval(() => {
const newData = {
albumId: 25000,
id: 24000,
title: 'zaalim haakim',
url: 'google.com',
thumbnailUrl: 'google.com',
};
this.table.reset();
}, 3000);

分叉工作示例