/angular-dependency-injection
Configure DI, inject() usage, and providers in Angular. Use when configuring Angular dependency injection, using inject(), or defining providers.
$ npx -y skills add hoangnguyen0403/agent-skills-standard --skill angular-dependency-injection --agent claude-codeHow it fires
How this skill gets triggered: by you, by Claude, or both.
- Fires itselfAuto-invocation. Claude auto-loads it when your prompt matches the work.Auto-invocation is when the right skill fires by itself at the right moment, driven by a FLOW.md router and a hook, instead of you invoking it by name. It is the difference between a skill being installed and a skill actually getting used.Read the full definition →
- You can call itInvoke it directly when you want it.
- Slash command
/angular-dependency-injection
Context preview
The summary Claude sees to decide when to auto-load this skill.
Configure DI, inject() usage, and providers in Angular. Use when configuring Angular dependency injection, using inject(), or defining providers.
SKILL.md
angular-dependency-injection.SKILL.mdname: angular-dependency-injection
description: Configure DI, inject() usage, and providers in Angular. Use when configuring Angular dependency injection, using inject(), or defining providers.
metadata:
triggers:
files:
- '**/*.service.ts'
keywords:
- angular inject
- providedIn
- injection token
- provideAppInitializerDependency Injection
**Priority: P0 (CRITICAL)**
Principles
- **`inject()` over Constructor**: Use **inject(MyService)** function in **class fields or constructor-equivalent** class positions for cleaner injection. It works in any **injection context** (class fields, factory functions, guards).
- **Tree Shaking**: Always use **@Injectable({ providedIn: 'root' })** for app-wide singletons unless specific scoping required.
- **Tokens**: Use **new InjectionToken<T>('description')** for configuration, primitives, or interface abstraction. Provide via: **{ provide: API_URL, useValue: 'https://api.example.com' }** in `app.config.ts`. Inject with: **inject(API_URL)**.
Guidelines
- **Providers**: Prefer **provide\*()** functions (e.g., **provideHttpClient()**) in `app.config.ts` providers array over importing NgModules.
- **Factories**: Use `useFactory` strictly when dependencies need runtime configuration.
- **App Initializer**: Use **provideAppInitializer(() => inject(ConfigService).load())** (Angular 19+) to run async code **before app bootstrap** — replaces old `APP_INITIALIZER` token pattern.
- **Route Providers**: Scope services to route tree using **providers: [MyService]** in **route config** ( routes array) instead of `providedIn: 'root'`. This creates instance destroyed when leaving route.
- **Multi Providers**: Use **{ provide: TOKEN, useClass: Impl, multi: true }** to **collects all multi providers** into array (e.g., **HTTP_INTERCEPTORS**, validators).
Anti-Patterns
- **No `providedIn: 'platform'`**: Use `'root'` scoping; reserve platform only for Micro Frontend sharing.
- **No `forwardRef`**: Refactor architecture to eliminate circular dependencies instead.
References
- [DI Patterns](references/di-patterns.md)
Canonical response anchors
When this skill applies, preserve the following domain terminology or equivalent concrete examples in the answer when relevant:
- HTTP_INTERCEPTORS
- before app bootstrap
- class fields or constructor-equivalent
- collects all multi providers
- inject(MyService)
- provideHttpClient()
- providers: [MyService]
- route config
- Additional task-grounded exact anchors: inject(API_URL)
Read more
name: angular-dependency-injection
description: Configure DI, inject() usage, and providers in Angular. Use when configuring Angular dependency injection, using inject(), or defining providers.
metadata:
triggers:
files:
- '**/*.service.ts'
keywords:
- angular inject
- providedIn
- injection token
- provideAppInitializerDependency Injection
**Priority: P0 (CRITICAL)**
Principles
- **`inject()` over Constructor**: Use **inject(MyService)** function in **class fields or constructor-equivalent** class positions for cleaner injection. It works in any **injection context** (class fields, factory functions, guards).
- **Tree Shaking**: Always use **@Injectable({ providedIn: 'root' })** for app-wide singletons unless specific scoping required.
- **Tokens**: Use **new InjectionToken<T>('description')** for configuration, primitives, or interface abstraction. Provide via: **{ provide: API_URL, useValue: 'https://api.example.com' }** in `app.config.ts`. Inject with: **inject(API_URL)**.
Guidelines
- **Providers**: Prefer **provide\*()** functions (e.g., **provideHttpClient()**) in `app.config.ts` providers array over importing NgModules.
- **Factories**: Use `useFactory` strictly when dependencies need runtime configuration.
- **App Initializer**: Use **provideAppInitializer(() => inject(ConfigService).load())** (Angular 19+) to run async code **before app bootstrap** — replaces old `APP_INITIALIZER` token pattern.
- **Route Providers**: Scope services to route tree using **providers: [MyService]** in **route config** ( routes array) instead of `providedIn: 'root'`. This creates instance destroyed when leaving route.
- **Multi Providers**: Use **{ provide: TOKEN, useClass: Impl, multi: true }** to **collects all multi providers** into array (e.g., **HTTP_INTERCEPTORS**, validators).
Anti-Patterns
- **No `providedIn: 'platform'`**: Use `'root'` scoping; reserve platform only for Micro Frontend sharing.
- **No `forwardRef`**: Refactor architecture to eliminate circular dependencies instead.
References
- [DI Patterns](references/di-patterns.md)
Canonical response anchors
When this skill applies, preserve the following domain terminology or equivalent concrete examples in the answer when relevant:
- HTTP_INTERCEPTORS
- before app bootstrap
- class fields or constructor-equivalent
- collects all multi providers
- inject(MyService)
- provideHttpClient()
- providers: [MyService]
- route config
- Additional task-grounded exact anchors: inject(API_URL)
The portable SDLC standards layer for AI coding agents. Sync once, then work in your own runtime.
Repo: hoangnguyen0403/agent-skills-standard
Other skills on agent-skills-standard.
- /android-agp-upgrade
Upgrade an Android project to Android Gradle Plugin (AGP) 9. Use when migrating to AGP 9, updating Gradle build files, migrating to built-in Kotlin, or adopting the new AGP DSL.
Open skill - /android-architecture
Apply Clean Architecture layering, modularization, and Unidirectional Data Flow in Android projects. Use when setting up project structure, placing code in layers, configuring feature/core modules, or implementing UDF patterns; defer Compose state and ViewModel/StateFlow
Open skill - /android-background-work
Implement WorkManager and background processing correctly on Android. Use when creating Worker classes, scheduling tasks, choosing between WorkManager and Foreground Services, or setting up Hilt in workers; defer FCM and notification delivery to android-notifications.
Open skill - /android-compose-migration
Migrate an Android XML View to Jetpack Compose following a structured 10-step workflow. Use when converting XML layouts to Compose, setting up Compose in an existing View-based project, or incrementally adopting Compose.
Open skill - /android-compose
Build high-performance declarative UI with Jetpack Compose. Use when writing Composable functions, optimizing recomposition, hoisting state, or working with LazyColumn and side effects; defer deep-link and navigation routing to android-navigation.
Open skill - /android-concurrency
Write correct coroutine scopes, lifecycle collection, and dispatcher injection in Android production code. Use for suspend functions, coroutine scopes, and dispatcher mechanics; defer ViewModel StateFlow/LiveData architecture, Fragment lifecycle recipes,
Open skill

