0.0.3 • Published 2 years ago
esnpage v0.0.3
Angular 14 - Paginated Data for ngFor loop
------------------DEMO--------------------
https://angular-ivy-jzqxke.stackblitz.io/
https://stackblitz.com/edit/angular-esnpage
------------------INSTALLATION--------------------
npm i esnpage --force
import { EsnpageModule } from esnpage
------------------USAGE--------------------
---------Template html file
<div *ngFor="let i of data|pager:pageNumber:2">
.
.
.
</div>
<esnpage
[dataLength]="data.length" //Length ofyour data
[itemPerPage]="2" //Item Per Page
[pageNumber]="pageNumber" //Current page number
(pageChanged)="pageNumber=$event">
</esnpage>
---------ts file
pageNumber=1;
data = [
{
name: 'Germany'
},
{
name: 'Usa'
},
{
name: 'England'
},
{
name: 'Sweden'
},
{
name: 'UAE'
},
{
name: 'Ukraine'
},
{
name: 'Korea'
},
{
name: 'Japan'
},
{
name: 'Argentina'
},
]