https://github.com/soc221b/ngx-url-serializer
https://github.com/soc221b/ngx-url-serializer
angular qs router
Last synced: 5 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/soc221b/ngx-url-serializer
- Owner: soc221b
- License: mit
- Created: 2024-10-11T06:46:22.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2026-06-06T08:26:50.000Z (16 days ago)
- Last Synced: 2026-06-06T10:12:15.656Z (16 days ago)
- Topics: angular, qs, router
- Language: TypeScript
- Homepage: https://github.com/angular/angular/pull/58580
- Size: 189 KB
- Stars: 1
- Watchers: 0
- Forks: 0
- Open Issues: 8
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README
# ngx-url-serializer
## Installation
```bash
npm install ngx-url-serializer
```
## Usage
### Preset Serializer
```typescript
// app.config.ts
import { ApplicationConfig } from "@angular/core";
import { UrlSerializer } from "@angular/router";
import { QsUrlSerializer } from "ngx-url-serializer";
export const appConfig: ApplicationConfig = {
providers: [
{
provide: UrlSerializer,
useClass: QsUrlSerializer,
// if you want to override the default options:
// useValue: new QsUrlSerializer({ parse: { ... }, stringify: { ... } }),
},
],
};
```
### Custom Serializer
```typescript
// custom-url-serializer.ts
import { QueryUrlSerializer } from "ngx-url-serializer";
export class CustomUrlSerializer extends QueryUrlSerializer {
constructor() {
super();
}
override parseQueryParams(query: string): undefined | Params {
return query.startsWith("?")
? // implement your custom query string parsing logic here
: undefined;
}
override serializeQueryParams(queryParams: Params): string {
return Object.keys(queryParams).length
? // implement your custom query string serialization logic here
: "";
}
}
```
```typescript
// app.config.ts
import { ApplicationConfig } from "@angular/core";
import { UrlSerializer } from "@angular/router";
import { CustomUrlSerializer } from "./custom-url-serializer";
export const appConfig: ApplicationConfig = {
providers: [
{
provide: UrlSerializer,
useClass: CustomUrlSerializer,
},
],
};
```