Angular Cursor Rules Template

---
description: "Component Architecture"
alwaysApply: false
---
- Use standalone components by default (no NgModules).
- Use the new control flow syntax (@if, @for, @switch).
- Use    spaces for indentation.
- Use camelCase for property and method names.
- Keep components small and focused on presentation logic.
- Delegate business logic to services.

---
description: "Services & Dependency Injection"
alwaysApply: false
---
- Use providedIn: 'root' for singleton services.
- Use inject() function instead of constructor injection.
- Keep services focused on a single concern.
- Use signals (signal(), computed(), effect()) for reactive state.
- Use HttpClient with typed response generics.
- Use interceptors for cross-cutting concerns (auth, logging, error handling).

---
description: "Routing & Navigation"
alwaysApply: false
---
- Use lazy loading with loadComponent for route-level code splitting.
- Use routerLink for internal navigation.
- Use route resolvers for pre-fetching data.
- Use route guards (canActivate, canDeactivate) for access control.
- Use withComponentInputBinding() for route params as component inputs.
- Define routes in a dedicated routes.ts file per feature module.

---
description: "Forms & Validation"
alwaysApply: false
---
- Use Reactive Forms for complex forms with dynamic validation.
- Use Template-driven Forms for simple forms.
- Use FormBuilder to create form groups concisely.
- Implement custom validators as standalone functions.
- Use async validators for server-side validation.
- Provide clear error messages with form control state tracking.