angular-routing

Configure Angular routes with guards, lazy loading, and resolvers.

9|1|Updated Jun 16, 2026
One-click install
npx skills add https://github.com/AratKruglik/antigravity-sdlc --skill angular-routing-aratkruglik
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: angular-routing
Source: https://github.com/AratKruglik/antigravity-sdlc/tree/main/plugins/angular-plugin/skills/angular-routing
Command: npx skills add https://github.com/AratKruglik/antigravity-sdlc --skill angular-routing-aratkruglik

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Angular Router is built-in using the Angular router; route configuration for standalone and NgModule projects, functional guards (Angular 14.1+), lazy loading, route resolvers, typed params via signals/observables, programmatic navigation, route data and meta.

Use this skill to:

  • Configure routes (standalone-style or NgModule-style).
  • Use functional guards (canActivate as function, preferred over class-based in 17+).
  • Lazy-load components or feature modules.
  • Implement auth guards via route meta + functional guards.
  • Read params/queries via inject(ActivatedRoute) + signals or RxJS.

Do NOT use this skill for:

  • General conventions (see angular-conventions).
  • State management (see angular-state-and-rx).
  • Forms (see angular-forms).
  • Testing routes (see angular-testing).

Core Features & Use Cases

  • Configure routes in standalone-style or NgModule-style projects.
  • Use functional guards (canActivate as function) and lazy-load components or feature modules.
  • Implement auth guards via route meta and functional guards.
  • Read params and queries via inject(ActivatedRoute) + signals or RxJS.

Quick Start

Create a routes file configuring standalone or NgModule style routes and bootstrap the router in your AppModule.

Frequently Asked Questions about angular-routing

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I configure Angular routes with functional guards and lazy loading?

Configure Angular routes using functional canActivate guards and loadComponent or loadChildren for lazy loading, supporting both standalone and NgModule apps to enable protected and dynamically loaded views.

What is the best way to read route params and queries in Angular?

Read Angular route params and queries by injecting ActivatedRoute and using signals or RxJS observables to access typed route data, enabling reactive parameter retrieval in components.

How do I implement auth guards in Angular 17+?

Implement auth guards in Angular 17+ using functional canActivate guards combined with route meta data, replacing class-based guards to secure routes through standalone functional logic.

Can I use Angular routing in both standalone and NgModule projects?

Angular routing works in both standalone and NgModule projects by configuring route arrays that support lazy loading, functional guards, and resolvers across either architectural style for flexible app setup.

When should I not use this Angular routing approach?

Avoid using this Angular routing approach for general conventions, state management, forms, or testing routes, as it specifically targets route configuration, guards, lazy loading, and parameter reading.