Pagination
To enable Row pagination functionality use paginator property of m-footer component.
The length of the total number of items, pageIndex, pageSize and pageSizeOptions could be bind using length, pageIndex, pageSize and pageSizeOptions properties respectively.
<m-table [value]=countries>
<m-footer paginator=true
[length]="100" [pageIndex]="0" pageSize="10" pageSizeOptions="[10,20,50]">
</m-footer>
</m-table>
Changing page size or page index triggers onPage event from m-table component.
<m-table [value]=countries (onPage)="pageChange($event)>
<m-footer paginator=true"></m-footer>
</m-table>
Table Component m-table
Properties
| Name | Default | Description |
|---|---|---|
| @Output() onPage |
- | Event emitted when the paginator changes the page size or page index. |
Footer Component m-footer
Properties
| Name | Default | Description |
|---|---|---|
| @Input() paginator: boolean |
false | whether pagination is enabled or not. |
| @Input() length: number |
- | The length of the total number of items that are being paginated. |
| @Input() pageIndex: number |
0 | The zero-based page index of the displayed list of items. |
| @Input() pageSize: number |
10 | Number of items to display on a page. By default set to 50. |
| @Input() pageSizeOptions: number[] |
[5,10,25] | The set of provided page size options to display to the user. |