---
name: hoangnguyen0403-angular-routing
description: "Configure Angular Router with lazy-loaded routes, functional guards, and component input binding. Use when defining routes, lazy-loading features, creating route guards, or setting up resolvers."
license: "Apache-2.0"
metadata:
  decimalai-skill-id: "ce8f77ad-1529-401f-9956-d1c82775eb64"
  decimalai-version-id: "55c09865-28cd-4f7b-82c5-a3e84c2bf3a5"
  decimalai-version: "1"
  decimalai-body-sha256: "c6c5aab171c17f278de23a52d27d0971cb7df866ee798e8c88237a2ab836598d"
  decimalai-name: "hoangnguyen0403/angular-routing"
  decimalai-format: "1"
  decimalai-invocation: "model"
  decimalai-category: "frontend"
  decimalai-source: "https://app.decimal.ai/s/hoangnguyen0403-angular-routing@1/SKILL.md"
---
# Routing

## **Priority: P0 (CRITICAL)**

## 1. Lazy Load All Feature Routes

- Use `loadComponent` (standalone) or `loadChildren` (route file) for every feature route.

See [routing patterns](references/routing-patterns.md) for lazy loading and guard examples.

## 2. Use Functional Guards

- Create function-based guards (`CanActivateFn`) instead of deprecated class-based guards.

See [routing patterns](references/routing-patterns.md) for functional guard implementation.

## 3. Enable Component Input Binding

- Configure `withComponentInputBinding()` in `provideRouter(routes, withComponentInputBinding())`.
- Define `input.required<string>()` in components — Angular auto-maps route params, query params, and resolve data.

## 4. Configure Resolvers and Titles

- Create `ResolveFn<T>` to pre-fetch critical data before navigation.
- Provide custom `TitleStrategy` or use `title: 'Dashboard'` in route data.

## Anti-Patterns

- **No logic in route config**: Move access control and data fetching to dedicated Guards and Resolvers.
- **No eager feature imports**: Use `loadComponent` or `loadChildren` for all feature routes.

## References

- [Routing Patterns](references/routing-patterns.md)

## Canonical response anchors

When this skill applies, preserve the following domain terminology or equivalent concrete examples in the answer when relevant:
- No logic
- deprecated