🎯

angular-routing

🎯Skill

from analogjs/angular-skills

What it does

Covers Angular routing patterns including lazy loading, route guards, resolvers, nested routes, and navigation strategies for Angular v20+

Overview

Angular Routing is a Claude Code skill that provides comprehensive guidance for implementing routing in Angular v20+ applications. It covers lazy loading, functional guards, resolvers, signal-based route parameters, and nested routing configurations to help AI agents generate modern Angular routing code.

Key Features

Lazy Loading Support - Load feature modules and individual components on demand using loadChildren and loadComponent for optimized bundle sizes
Signal-Based Route Parameters - Access route parameters as signal inputs using input() with withComponentInputBinding(), replacing the older ActivatedRoute approach
Functional Guards and Resolvers - Implement authentication and data loading using modern functional patterns instead of class-based guards
Nested Route Configuration - Set up child routes and feature route files with proper path matching and wildcard handling
Router Directives - Use RouterOutlet, RouterLink, and RouterLinkActive for navigation UI with active state tracking

Who is this for?

This skill is designed for developers building Angular v20+ applications who need to set up navigation, protected routes, and route-based data loading. It is particularly useful for teams adopting modern Angular patterns with signals and functional guards.

📦

Same repository

analogjs/angular-skills(10 items)

angular-routing

Installation

Vibe Index InstallInstalls to .claude/skills/ - auto-recognized by Claude Code

npx vibeindex add analogjs/angular-skills --skill angular-routing

skills.sh Install⚠ Installs to .agents/skills/ - may not be auto-recognized by Claude Code

npx skills add analogjs/angular-skills --skill angular-routing

Manual InstallCopy SKILL.md content and save to the path below

~/.claude/skills/angular-routing/SKILL.md

SKILL.md

4,517Installs

245

Last UpdatedJan 24, 2026

View on GitHub Back to Skills

More from this repository9

🎯

angular-component🎯Skill

An Angular v20+ component skill from the analogjs/angular-skills collection, teaching AI coding agents modern standalone component patterns with signal inputs/outputs, OnPush change detection, and native control flow.

🎯

angular-signals🎯Skill

Angular v20+ Signals API best practices for reactive state management, computed values, and effect handling.

🎯

angular-forms🎯Skill

Angular skills for building signal-based forms with Angular v21+'s Signal Forms API, including schema-based validation, two-way binding, and dynamic form patterns.

🎯

angular-http🎯Skill

Covers Angular HttpClient patterns including interceptors, error handling, request/response transformation, and API communication best practices

🎯

angular-di🎯Skill

Covers Angular v20+ dependency injection using inject(), injection tokens, and provider configuration for service architecture, managing singleton vs scoped services, and understanding the DI hierarchy.

🎯

angular-directives🎯Skill

Covers Angular directive patterns including custom attribute and structural directives, DOM manipulation, and component behavior extension

🎯

angular-testing🎯Skill

Angular skills for building signal-based forms with Angular v21+'s Signal Forms API, including schema-based validation, two-way binding, and dynamic form patterns.

🎯

angular-tooling🎯Skill

Covers Angular development tooling including Angular CLI, build optimization, testing configuration, and project scaffolding for Angular v20+

🎯

angular-ssr🎯Skill

Angular skills for building signal-based forms with Angular v21+'s Signal Forms API, including schema-based validation, two-way binding, and dynamic form patterns.