Angular Pagination Component
Usage instructions available at https://jasonwatmore.com/post/2018/04/26/npm-jw-angular-pagination-component
A simple lightweight pagination component for Angular 2+ available on npm
Home Page: https://jasonwatmore.com/post/2018/04/26/npm-jw-angular-pagination-component
License: MIT License
Angular Pagination Component
Usage instructions available at https://jasonwatmore.com/post/2018/04/26/npm-jw-angular-pagination-component
When I try to compile with --aot flag I get the following error.
ERROR in node_modules/jw-angular-pagination/lib/jw-pagination.component.d.ts.JwPaginationComponent.html(9,10): Property 'setPage' is private and only accessible within class 'JwPaginationComponent'.
node_modules/jw-angular-pagination/lib/jw-pagination.component.d.ts.JwPaginationComponent.html(3,10): Property 'setPage' is private and only accessible within class 'JwPaginationComponent'.
node_modules/jw-angular-pagination/lib/jw-pagination.component.d.ts.JwPaginationComponent.html(6,10): Property 'setPage' is private and only accessible within class 'JwPaginationComponent'.
node_modules/jw-angular-pagination/lib/jw-pagination.component.d.ts.JwPaginationComponent.html(12,10): Property 'setPage' is private and only accessible within class 'JwPaginationComponent'.
node_modules/jw-angular-pagination/lib/jw-pagination.component.d.ts.JwPaginationComponent.html(15,10): Property 'setPage' is private and only accessible within class 'JwPaginationComponent'.
Due to accessibility requirements, I was wondering how page numbers can be selected through the use of the keyboard.
Thanks for help.
Eg: Given
First - 1 - 2 -3 -4 ..... Latest
I would like to go to page 3 just by clicking a number within the keyboard or any other combination.
You need to add aria tags to BS pagination design elements to be 508 compliant.
https://getbootstrap.com/docs/3.3/components/#pagination
Hi, when trying to build with ng build --prod . This library throw an error
Unexpected value 'JwPaginationComponent in /Users/firmcode1/Documents/projects/fiction-project/production/node_modules/jw-angular-pagination/lib/jw-pagination.component.d.ts' declared by the module 'AppModule in /Users/firmcode1/Documents/projects/fiction-project/production//src/app/app.module.ts'. Please add a @Pipe/@Directive/@component annotation.
All the button's label are in english only.
Could you provide a way to define label for each one? It will enable me to support different languages not only english.
I have integrated this paginator to our project. What I observed is like whenever items is changing paginator has to change accordingly, but it doesn't seems to happen. Lets say initially i hav table with 100 records, 10 records per page, then i will be getting first,prev,1 to 10 next and last in paginator. Now when i am filtering on table, now items array is getting reduced to 25 records now i am expecting paginator to show first prev 1 2 3 next last first and second page having 10 records each, and 3rd page showing 5 records. BUt paginator is not getting changed instead its showing filtered records in all 10 pages. Another observation is like when we are getting data from service, onload of page table is empty and paginator is not visible, when we navigate to different tab and come back then data is getting populated. Let me if i am doing anything wrong.
Hi There
Are you planning to add the BS4 pagination styles? For now I have added them myself (quite hacky) however will loose them when deploying. I have tested and you can add the classes without effecting BS3 support.
Look forward to hearing from you.
Tom
I've looked at this library for pagination a few times and each time I've had to dismiss it as everything I've seen including your own site suggests that it only supports client-side pagination. Please please correct me if I'm wrong about this.
I am working currently with a data set of 12,000 items, I'm certainly not going to get them all back from the DB into the browser to then paginate them.
Hi,
I'm trying to apply this pagination module to my project and encountered a problem.
After installing jw-paginate package and setting "allowSyntheticDefaultImports" to true, all seems fine but jw-paginate.ts file is not found. The module seems to have no this file indeed. Can you please help how I can fix this?
Thanks,
Brian Liu
When I try to compile with --aot flag I get the following error.
ERROR in Error: Unexpected value 'JwPaginationComponent in /Users/codev/workspace/cumulus/node_modules/jw-angular-pagination/lib/jw-pagination.component.d.ts' declared by the module 'AppModule in /Users/codev/workspace/cumulus/src/app/app.module.ts'. Please add a @Pipe/@Directive/@component annotation.
at syntaxError (/Users/codev/workspace/cumulus/node_modules/@angular/compiler/bundles/compiler.umd.js:1729:34)
at /Users/codev/workspace/cumulus/node_modules/@angular/compiler/bundles/compiler.umd.js:15481:40
at Array.forEach (native)
at CompileMetadataResolver.getNgModuleMetadata (/Users/codev/workspace/cumulus/node_modules/@angular/compiler/bundles/compiler.umd.js:15463:54)
at addNgModule (/Users/codev/workspace/cumulus/node_modules/@angular/compiler/bundles/compiler.umd.js:24268:58)
at /Users/codev/workspace/cumulus/node_modules/@angular/compiler/bundles/compiler.umd.js:24279:14
at Array.forEach (native)
at _createNgModules (/Users/codev/workspace/cumulus/node_modules/@angular/compiler/bundles/compiler.umd.js:24278:26)
at analyzeNgModules (/Users/codev/workspace/cumulus/node_modules/@angular/compiler/bundles/compiler.umd.js:24153:14)
at analyzeAndValidateNgModules (/Users/codev/workspace/cumulus/node_modules/@angular/compiler/bundles/compiler.umd.js:24163:35)
at AotCompiler.analyzeModulesAsync (/Users/codev/workspace/cumulus/node_modules/@angular/compiler/bundles/compiler.umd.js:23797:46)
at CodeGenerator.codegen (/Users/codev/workspace/cumulus/node_modules/@angular/compiler-cli/src/codegen.js:32:14)
at Function.NgTools_InternalApi_NG_2.codeGen (/Users/codev/workspace/cumulus/node_modules/@angular/compiler-cli/src/ngtools_api.js:73:30)
at _donePromise.Promise.resolve.then (/Users/codev/workspace/cumulus/node_modules/@ngtools/webpack/src/plugin.js:428:58)
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.