Pagination doesn't work if used with MatTableDataSource & MatSort

[snehal2124]

Hi,

Angular version: 7.0.0

Angular Material version: 7.0.0

ngx-pagination version: 5.0.0

Description of issue: I cannot see the number of pages or traverse using Next/Prev if pagination is used with MatTableDataSource. If MatTableDataSource is skipped it works fine but I want to using MatSort feature of angular material which requires usage of MatTableDataSource.

Steps to reproduce:

1. Use mat-table and MatTableDataSource
2. Apply Pagination on table
3. Observe pagination

Expected result: Pagination should work properly.

Actual result: Pagination doesn't work

Demo: https://stackblitz.com/edit/angular-c8qkvb

[michaelbromley]

Hi,

I don't personally have any experience using the Material data-table, but from just looking over the docs it seems that the [dataSource] input is doing more than just a regular ngFor:

If a data array is provided, the table must be notified when the array's objects are added, removed, or moved. This can be done by calling the renderRows() function which will render the diff since the last table render. If the data array reference is changed, the table will automatically trigger an update to the rows.
https://material.angular.io/components/table/api#MatTable

This library is designed to work with ngFor specifically, and I can't guarantee that it integrates with other APIs providing similar functionality.

Plus it seems like the Material data table has its own pagination implementation: https://material.angular.io/components/table/overview#pagination

Why not use that one instead?

[snehal2124]

Material data table has its own pagination implementation, but the UI required it completely different.
I also tried to use renderRow but it doesn't work.

So I preferred using ngx-pagination.
Can you support mat-table as well?

[michaelbromley]

I'm afraid I won't be able to work on support myself. I do not use the Material components personally. But I am open to supporting it is someone wants to put in a pull request.