动态添加数据时，Angular Mat table页面大小问题

Question

我有一个带有数据源的垫表，在其中我可以使用websockets动态添加和删除数据

if (index > -1) {
        // update at same position
        if (order.status == 'arrived' || order.status == 'canceled') {
            this.data.splice(index, 1);
            this.pageLength -= 1;
        }
        else {
            this.data.splice(index, 1, order);
        }
    }
    else {
        if (order.status !== 'arrived' && order.status !== 'canceled') {
            this.data = [...this.data, order];
            this.pageLength += 1;
        }
    }
this.orders = new MatTableDataSource(this.data);
this.orders.paginator = this.paginator;
this.orders.sort = this.sort;
this.cdr.detectChanges();

但是该值被添加到第一页而不是最后一页。

按照我的排序逻辑。应该将其添加到数据的最后一页。

数据长度为70。页面大小为20。

每当我添加一行时，第一页就会变大。它不会停留在20