Direct answer
Yes. When you replace a MatTable's DataSource, MatTable typically retains the previous paginator.pageIndex instead of resetting it to zero. The paginator usually recalculates getNumberOfPages() from the new data length, but the active page index can point beyond the new range. If the previous page index is greater than the last valid page of the smaller data set, the table can render no rows until the user changes pages or the index is clamped.
Confirmed behavior
- MatTable does not automatically reset
pageIndex on a DataSource swap. - Page count updates when the new data source emits its length or is bound; a stale page index is a separate state concern.
- This applies to client-side
MatTableDataSource; custom server-side DataSources manage their own total count and page state. - Behavior is version-dependent; confirm against your installed Angular Material release.
Recommended reset pattern
For MatTableDataSource, assign the new data array, wait for the table to bind it, then call paginator.firstPage() or set paginator.pageIndex = 0. Do not call it before the new DataSource is bound.
this.dataSource.data = newItems;
// After change detection has bound the new data:
this.paginator.firstPage();
If you use an Observable data source, place the reset inside the subscription after the table renders, or use afterNextRender to avoid ExpressionChangedAfterItHasBeenCheckedError.
Server-side DataSources
MatTable cannot know the remote total until the DataSource reports it, so there is no built-in automatic reset. Implement the reset in your DataSource when the total length changes, or listen to the length emission and call firstPage() from the component.
Verification
- Log
paginator.pageIndex and paginator.getNumberOfPages() before and after the swap. - Swap to a smaller data set while on a later page and confirm whether rows render.
- Apply
firstPage() after binding and confirm the first page of the new data appears.
Missing diagnostic: are you using MatTableDataSource (client-side) or a custom server-side DataSource? That determines whether the component or your DataSource owns the reset.
Review this draft against your installed Angular Material version before adopting the reset pattern.