Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/vojvodicn23/ngx-route-reuse
This is the Angular library for route reuse
https://github.com/vojvodicn23/ngx-route-reuse
angular cashing route-reuse
Last synced: about 2 months ago
JSON representation
This is the Angular library for route reuse
- Host: GitHub
- URL: https://github.com/vojvodicn23/ngx-route-reuse
- Owner: vojvodicn23
- License: mit
- Created: 2023-12-14T10:29:14.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2023-12-14T11:43:38.000Z (about 1 year ago)
- Last Synced: 2024-03-15T12:52:58.167Z (10 months ago)
- Topics: angular, cashing, route-reuse
- Language: TypeScript
- Homepage:
- Size: 126 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Angular Route Reuse (Cashing)
Suported Angular versions: 16 and 17.
[Click here to try it on StackBlitz](https://stackblitz.com/edit/stackblitz-starters-f1ythy)
## Usage
Add the package as a dependency to your project using:```
npm install ngx-route-reuse
# or
pnpm install ngx-route-reuse
# or
yarn add ngx-route-reuse
```Add module to you app.module imports:
```typescript
import { NgxRouteReuse } from 'ngx-route-reuse';
...
@NgModule({
providers: [{provide: RouteReuseStrategy, useClass: NgxRouteReuse}],
...
})
```Define reuseble components in route config:
```typescript
const routes: Routes = [
{
path: 'page1',
component: Page1Component,
data: {
name: 'Page1',
reuseRoute: true,
reuseFromComponents: ['Page2'], // optional - if defined it will reuse component only from specific component
},
},
{
path: 'page2',
component: Page2Component,
data: {
name: 'Page2',
reuseRoute: true,
// if not defined it will reuse component comming from any
},
},
{
path: 'page3',
component: Page3Component,
// no route reuse
},
...
];
```