https://github.com/piyalidas10/angular-pagination
Pagination in Angular 8
https://github.com/piyalidas10/angular-pagination
angular angular-pagination angular8 pagination table-pagination
Last synced: 2 months ago
JSON representation
Pagination in Angular 8
- Host: GitHub
- URL: https://github.com/piyalidas10/angular-pagination
- Owner: piyalidas10
- Created: 2020-04-04T14:35:09.000Z (about 6 years ago)
- Default Branch: master
- Last Pushed: 2023-01-07T16:43:12.000Z (over 3 years ago)
- Last Synced: 2025-01-21T18:23:02.162Z (over 1 year ago)
- Topics: angular, angular-pagination, angular8, pagination, table-pagination
- Language: TypeScript
- Size: 1.23 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 25
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Angular Pagination
Without using datatable, i have created this pagination with simple bootstrap table & bootstrap navigation menus.
# Run Application
```
ng serve
localhost:4200/
```
# Tutorials (For Help)
https://medium.com/angular-in-depth/top-10-ways-to-use-paginations-in-angular-db450f8a62d6
https://stackblitz.com/github/melcor76/paginations?file=src%2Fapp%2Fpaginations%2Fnotify.interptor.ts
https://embed.plnkr.co/plunk/KQ8xrl
# Pagination Inputs
1. itemsPerPage --------- How many items or data listing you want to show at a time / one page
2. initialPage --------- Starting page number
3. showPagesAtOneTime -------- How many pages you want to show at a time
4. dataLength -------- length of data items listing
# Comments Component
In Comment page, i want to display 5 pages at a time with this.showPagesAtOneTime = 5.
```
constructor(
private apiService: ApiService,
private cdRef: ChangeDetectorRef
) {
this.itemsPerPage = 20;
this.initialPage = 1;
this.currentPage = 1;
this.showPagesAtOneTime = 5;
}
```
# Photos Component
In Comment page, i want to display 10 pages at a time with this.showPagesAtOneTime = 10.
```
constructor(
private apiService: ApiService,
private cdRef: ChangeDetectorRef
) {
this.itemsPerPage = 20;
this.initialPage = 1;
this.currentPage = 1;
this.showPagesAtOneTime = 10;
this.getPhotosList();
}
```