Guia oficial Angular.dev
En este apartado hablaremos de las rutas en Angular:
Angular nos proporciona un módulo de rutas preconfigurado que nos permite hacer uso del mismo para mejorar la configuración de la navegación entre los diferentes componentes de la app.
Cada aplicación de angular debe tener un archivo llamado routes.ts ubicado dentro del directorio app; dicho fichero es una clase de typescript con un código sencillo escrito de la siguientes manera y siguiendo algunas reglas básicas:
En la primera linea importamos de @angular/router ( módulos proporcioando por Angular)
En la segunda línea declaramos una constante de Routes (módulo importado)
En la tercera línea hacemos la exportación global por defecto (default) para que dicha configuración pueda ser tomada o importada en un fichero o archivo llamado main.ts, en caso de que no veas ese ficherp en tu app significa que fue generada desde la cli de angular por consiguiente encontrarás importado en app.config.ts, el cual si contiene importado como providers el Router de Angular.
1. import { Routes } from '@angular/router'
2. const routes: Routes;
3. export default routes;
RouteReuseStrategy
Sirve para optimizar la reutilizacion de rutas en componentes reusables asi se reutilizan las rutas de angular visitadas .
Se crea un servicio: ng g s utilidades/services/lider-reuse-strategy
Agregamos el prover de la estrategia en appConfig.ts / Angular 19 en adelante), es el modulo principal de nuestra app.
{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy },
Debemos crear una estrategia personalizada, el codigo ideal es el siguiente:
import { ActivatedRouteSnapshot, DetachedRouteHandle, RouteReuseStrategy } from '@angular/router';
/**
* Provides a way to customize when activated routes get reused.
*/
export declare class IonicRouteStrategy implements RouteReuseStrategy {
/**
* Whether the given route should detach for later reuse.
*/
shouldDetach(_route: ActivatedRouteSnapshot): boolean;
/**
* Returns `false`, meaning the route (and its subtree) is never reattached
*/
shouldAttach(_route: ActivatedRouteSnapshot): boolean;
/**
* A no-op; the route is never stored since this strategy never detaches routes for later re-use.
*/
store(_route: ActivatedRouteSnapshot, _detachedTree: DetachedRouteHandle): void;
/**
* Returns `null` because this strategy does not store routes for later re-use.
*/
retrieve(_route: ActivatedRouteSnapshot): DetachedRouteHandle | null;
/**
* Determines if a route should be reused.
* This strategy returns `true` when the future route config and
* current route config are identical and all route parameters are identical.
*/
shouldReuseRoute(future: ActivatedRouteSnapshot, curr: ActivatedRouteSnapshot): boolean;
}