Skip to content
Development
Skill

/angular-dependency-injection

Configure DI, inject() usage, and providers in Angular. Use when configuring Angular dependency injection, using inject(), or defining providers.

From plugin
agent-skills-standard
583200 skills21 agents33 commands1 MCP

Claude Code

$ npx -y skills add hoangnguyen0403/agent-skills-standard --skill angular-dependency-injection --agent claude-code

SKILL.md

angular-dependency-injection.SKILL.md
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
    - provideAppInitializer

Dependency 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)
Read more
@hoangnguyen0403
Ships withagent-skills-standard

The portable standards layer for AI coding agents. Sync once, then work in your own runtime.

583200 skills21 agents1 MCP
Get the whole plugin

Stars on GitHub

Momentum

stars in total
583
Star history of hoangnguyen0403/agent-skills-standard on GitHub, a chart by star-history.com

Other skills on agent-skills-standard.

More skills from other plugins.

brainstorming
Auto-invoked

brainstorming

You MUST use this before any creative work - creating features, building components, adding functionality, modifying behavior, or…

@obra@obraInstall Skill
ask-matt

ask-matt

Ask which skill or flow fits your situation. A router over the skills in this repo.

skills2w309k
@mattpocock@mattpocockInstall Skill
accessibility
Auto-invoked

accessibility

Design, implement, and audit accessible UI to WCAG 2.2 Level AA across Web, iOS, and Android — semantic ARIA roles and labels,…

ecc2w293k
@affaan-m@affaan-mInstall Skill
compiler-commit

compiler-commit

Use when you want to verify compiler changes and commit with the correct convention. Runs tests, lint, and format, then commits…

react5d252k
@facebook@facebookInstall Skill

Questions about angular-dependency-injection.

Which coding agents can use angular-dependency-injection?
angular-dependency-injection installs in Claude Code, Codex, Cursor, Gemini CLI, GitHub Copilot, OpenCode and Windsurf with the skills CLI, using each agent's flag shown on this page. Flowy's auto-invocation, which fires a skill when your prompt matches, runs in Claude Code only.