用途
Angular Router 技能用于在 Angular 应用中处理导航与路由相关任务。当需要配置应用路由、实现路由守卫、设置特性模块懒加载、处理路由参数与查询参数、实现嵌套与子路由、创建导航菜单与面包屑、处理路由过渡与动画、实现路由重定向与通配符，以及处理路由事件与导航生命周期时，可启用该技能。
主要能力与规则
路由配置
- 在独立应用的 app.config.ts 中使用 provideRouter(routes)。
- 将路由定义放在独立的 routes.ts 文件中。
- 空路径重定向使用 pathMatch: 'full'。
- 将通配符路由（**）作为最后一条路由，用于 404 处理。
懒加载
- 使用 loadChildren 懒加载特性路由。
- 使用 loadComponent 懒加载独立组件。
- 不要在路由配置中提前导入特性模块。
路由守卫
- 使用基于 inject() 的函数式守卫进行依赖注入。
- 守卫返回布尔值或 UrlTree。
- 使用 router.createUrlTree(['/path']) 实现守卫重定向。
- 不要使用基于类的守卫（CanActivate、CanDeactivate 接口）。
路由参数
- 使用 toSignal(route.params, { initialValue }) 访问路由参数。
- 使用 toSignal(route.queryParams, { initialValue }) 访问查询参数。
- 将路由 observable 转换为信号时提供 initialValue。
- 不要手动订阅 route.params 或 route.queryParams。
导航
- 使用 router.navigate(['/path']) 进行编程式导航。
- 使用 [routerLink]="['/path']" 进行模板导航。
- 不要通过 window.location 直接操作 URL。
使用方式
基础设置
在 app.routes.ts 中定义路由数组，包含空路径重定向、各页面组件路由以及最后的通配符 404 路由。在 app.config.ts 中通过 provideRouter(routes) 注册。
懒加载示例
特性模块使用 loadChildren 动态导入并返回路由数组；独立组件使用 loadComponent 动态导入组件类。
路由守卫示例
定义函数式守卫，通过 inject 获取 AuthService 与 Router，根据认证状态返回 true 或 router.createUrlTree(['/login'])。在路由配置中通过 canActivate 应用该守卫。
路由参数示例
在路由路径中定义参数（如 user/:id），在组件中通过 inject(ActivatedRoute) 获取路由，使用 toSignal 配合 map 提取参数并设置 initialValue。
适用场景
适用于 Angular 应用的路由配置、导航实现、权限守卫、按需加载、参数读取、嵌套路由、导航菜单与面包屑、路由动画、重定向与 404 处理、路由事件监听等开发任务。
限制
资料未提供该技能的收费、价格、平台支持范围、性能效果等具体信息，暂未提供。