Pagination
To Implement In-Memory Pagination
Simply pass true to the paginate input of the component. All your data will be paginated in-memory and only group by capability will
be lost. Charts are still fully-featured when using in-memory pagination.
In the template of the component
<ngx-deebodata
[paginate]="true"
[data]="someData()"
></ngx-deebodata>
To Implement Server-side Pagination
In the .ts component you want to use the data grid in
import { PageChange, NgxDeebodata } from 'ngx-deebodata';
In the exported class
handlePageChange(event: PageChange) {//executes on paginator change if serverSideTotal > 0
//implement a server side http request using the data emitted here and update the data input with your resulting response array of data.
//You can update the serverSideTotal here also for instance if you're using filters and want a new total from your backend based on said filters
Keep the serverSideTotal > rowsPerPage even on failed or no result api responses so that this function gets invoked!!
/*PageChange interface -> { skip: number; take: number; columnConfig?: any; topLevelFilter: string; sortOrder: string[]; }
skip will be the page number selected - 1. So selecting page 1 will emit a skip equal to 0 for your custom logic
take will be equal to the rowsPerPage value you can update
topLevelFilter is the value of the omnifilter input above the data grid
columnConfig contains the filter values on a per column basis and an 'asc' or 'desc' value for any sorted columns
sortOrder is a string[] with a list of column names in order of sort priority, if any sorts are applied*/
// console.log(event)
//charts and filters are limited to the data currently in memory when using server side pagination
}
In the template of the component
<ngx-deebodata
[paginate]="true"
[serverSideTotal]="1000000"
[pageLoadMessage]="'Loading...'"
[data]="someServerPaginatedData()"
(pageChange)="handlePageChange($event)"
></ngx-deebodata>
