search

reyesoft / ngx-jsonapi

JSON API client library for Angular 5+ 👌 :: Production Ready 🚀
https://ngx-jsonapi.reyesoft.com/
MIT License
101 stars 52 forks source link

make pagination meta response configurable #234

Open n2ygk opened 5 years ago

n2ygk commented 5 years ago

My backend {json:api} pagination implementation returns a different (non-standard) meta pagination response for a collection. Instead of as in the demo:

"meta": {
        "page": 1,
        "resources_per_page": 10,
        "total_resources": 11
    }

Django REST Framework JSON-API returns:

    "meta": {
        "pagination": {
            "page": 1,
            "pages": 60,
            "count": 600
        }
    }

In lieu of {json:api} ever standardizing the pagination response, it would be nice to have a way to configure or override this: https://github.com/reyesoft/ngx-jsonapi/blob/a7eef311b9443a9636a556e8fedc5e4b9d526667/src/document-collection.ts#L43-L48

My Javascript is weak, so pointers for workarounds would be greatly appreciated.

pablorsk commented 5 years ago

For now, we have JsonapiConfig and you only change parameter on URL.

But we can add some feature, with a clousure function for page determination. We need to check if is compatible with JsonApi specitifacion.

n2ygk commented 5 years ago

Thanks @pablorsk. I was trying to figure out how to submit a PR for this but was unable to get the github repo working properly via npm link. What am I doing wrong?

ngx-jsonapi$ pwd
/Users/alan/src/ngx-jsonapi
ngx-jsonapi$ git branch
* (HEAD detached at 2.1.8)
  v2.1
ngx-jsonapi$ yarn run build
yarn run v1.17.3
$ ts-node ./build/index.ts
✔ Removing "./dist" Folder
✔ Compiling packages with NGC
✔ Bundling FESMs
✔ Down-leveling FESMs to ES5
✔ Creating UMD Bundles
✔ Renaming package entry files
✔ Cleaning TypeScript files
✔ Cleaning JavaScript files
✔ Removing remaining sourcemap files
✔ Copying type definition files
✔ Copying schematic files
✔ Minifying UMD bundles
✔ Copying documents
✔ Copying package.json files
$ rimraf **/dist/**/*.ngsummary.json
✨  Done in 21.19s.
ngx-jsonapi$

Then in my app:

(venv) client-ngx-jsonapi$ rm node_modules/ngx-jsonapi
(venv) client-ngx-jsonapi$ npm link ../../ngx-jsonapi/dist/
npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN ngx-jsonapi@2.1.8 requires a peer of @angular/core@^6.0.0 but none is installed. You must install peer dependencies yourself.

updated 1 package and audited 1 package in 0.761s
found 0 vulnerabilities

/usr/local/lib/node_modules/ngx-jsonapi -> /Users/alan/src/ngx-jsonapi/dist
/Users/alan/src/tech-stds-cat/client-ngx-jsonapi/node_modules/ngx-jsonapi -> /usr/local/lib/node_modules/ngx-jsonapi -> /Users/alan/src/ngx-jsonapi/dist
(venv) client-ngx-jsonapi$ ng serve
10% building 4/4 modules 0 activeℹ ｢wds｣: Project is running at http://localhost:4200/webpack-dev-server/
ℹ ｢wds｣: webpack output is served from /
ℹ ｢wds｣: 404s will fallback to //index.html

chunk {categories-categories-module} categories-categories-module.js, categories-categories-module.js.map (categories-categories-module) 13.4 kB  [rendered]
chunk {lifecycles-lifecycles-module} lifecycles-lifecycles-module.js, lifecycles-lifecycles-module.js.map (lifecycles-lifecycles-module) 13 kB  [rendered]
chunk {main} main.js, main.js.map (main) 690 kB [initial] [rendered]
chunk {platform_references-platform_references-module} platform_references-platform_references-module.js, platform_references-platform_references-module.js.map (platform_references-platform_references-module) 16.4 kB  [rendered]
chunk {platforms-platforms-module} platforms-platforms-module.js, platforms-platforms-module.js.map (platforms-platforms-module) 14.9 kB  [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 662 kB [initial] [rendered]
chunk {polyfills-es5} polyfills-es5.js, polyfills-es5.js.map (polyfills-es5) 982 kB [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 9.3 kB [entry] [rendered]
chunk {standards-standards-module} standards-standards-module.js, standards-standards-module.js.map (standards-standards-module) 19.8 kB  [rendered]
chunk {styles} styles.js, styles.js.map (styles) 131 kB [initial] [rendered]
chunk {vendor} vendor.js, vendor.js.map (vendor) 6.12 MB [initial] [rendered]
Date: 2019-10-10T14:58:38.550Z - Hash: 2b2f76652edf30c027df - Time: 9365ms
** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
ℹ ｢wdm｣: Compiled successfully.

When I open in the browser, I get this unhandled promise rejection. When I just do an npm i ngx-jsoanp@2.1.8i it works fine.

Unhandled Promise rejection: StaticInjectorError(AppModule)[HttpHandler -> Injector]: 
  StaticInjectorError(Platform: core)[HttpHandler -> Injector]: 
    NullInjectorError: No provider for Injector! ; Zone: <root> ; Task: Promise.then ; Value: NullInjectorError: StaticInjectorError(AppModule)[HttpHandler -> Injector]: 
  StaticInjectorError(Platform: core)[HttpHandler -> Injector]: 
    NullInjectorError: No provider for Injector!
    at NullInjector.push../node_modules/@angular/core/fesm5/core.js.NullInjector.get (http://127.0.0.1:4200/vendor.js:83393:25)
    at resolveToken (http://127.0.0.1:4200/vendor.js:94585:24)
    at tryResolveToken (http://127.0.0.1:4200/vendor.js:94529:16)
    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (http://127.0.0.1:4200/vendor.js:94431:20)
    at resolveToken (http://127.0.0.1:4200/vendor.js:94585:24)
    at tryResolveToken (http://127.0.0.1:4200/vendor.js:94529:16)
    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (http://127.0.0.1:4200/vendor.js:94431:20)
    at resolveNgModuleDep (http://127.0.0.1:4200/vendor.js:102901:29)
    at _createClass (http://127.0.0.1:4200/vendor.js:102948:68)
    at _createProviderInstance (http://127.0.0.1:4200/vendor.js:102918:26) NullInjectorError: StaticInjectorError(AppModule)[HttpHandler -> Injector]: 
  StaticInjectorError(Platform: core)[HttpHandler -> Injector]: 
    NullInjectorError: No provider for Injector!
    at NullInjector.push../node_modules/@angular/core/fesm5/core.js.NullInjector.get (http://127.0.0.1:4200/vendor.js:83393:25)
    at resolveToken (http://127.0.0.1:4200/vendor.js:94585:24)
    at tryResolveToken (http://127.0.0.1:4200/vendor.js:94529:16)
    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (http://127.0.0.1:4200/vendor.js:94431:20)
    at resolveToken (http://127.0.0.1:4200/vendor.js:94585:24)
    at tryResolveToken (http://127.0.0.1:4200/vendor.js:94529:16)
    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (http://127.0.0.1:4200/vendor.js:94431:20)
    at resolveNgModuleDep (http://127.0.0.1:4200/vendor.js:102901:29)
    at _createClass (http://127.0.0.1:4200/vendor.js:102948:68)
    at _createProviderInstance (http://127.0.0.1:4200/vendor.js:102918:26)
api.onUnhandledError @ zone.js:703
client:52 [WDS] Live Reloading enabled.