Angular Material Paginator Using Data from Front-End

Question

I am getting all the data together all at once from the back-end and using angular material paginator. All the data is shown in the same page. Can someone tell me how to divide the data based on page size using the angular material paginator and show the data in different pages.

The data which I am displaying in the UI is not in a table format with columns but a list of data in card format. It is an Ionic 4 Angular 8 application with ionic elements in HTML and I have placed the mat-paginator inside the ion-header tag.

Answer 1

All you need to do is add the paginator below the table and specify the page size:

<mat-paginator [pageSize]="10"></mat-paginator>