Retour au cours

Comprendre l'Injection de Dépendances (DI)

Le Développeur Angular Complet : de Zéro à Héros

21. Comprendre l'Injection de Dépendances (DI)

L'Injection de Dépendances (DI) est un motif de conception (design pattern) central dans Angular. Il permet à une classe (le dépendant) de recevoir ses dépendances (d'autres objets dont elle a besoin pour fonctionner) d'une source externe, plutôt que de les créer elle-même.

Pourquoi utiliser la DI ?

  1. Réutilisabilité : Les services peuvent être réutilisés dans différents composants.
  2. Testabilité : Plus facile de remplacer les dépendances réelles par des simulations (mocks) pendant les tests.
  3. Maintenabilité : Découple les composants de leurs dépendances, réduisant ainsi la complexité.

Les trois parties de la DI

  1. Le Consommateur/Dépendant : Le composant ou service qui a besoin de la dépendance (ex: un ProductComponent a besoin d'un ProductService).
  2. La Dépendance : La classe qui fournit la fonctionnalité requise (ex: ProductService).
  3. L'Injecteur : Le mécanisme intégré d'Angular qui crée et gère les instances des dépendances et les injecte au consommateur.

Comment Angular gère l'injection

L'injecteur d'Angular maintient une carte des jetons (généralement le type de la classe) vers les fournisseurs (recettes pour créer l'instance).

Lorsqu'un composant demande une dépendance via son constructeur, Angular cherche un fournisseur correspondant dans son arbre d'injection (en commençant par le niveau du composant, puis en remontant vers le module, et enfin la racine).

Exemple de demande de dépendance :

typescript import { LoggerService } from './logger.service';

// Angular lit le paramètre du constructeur et tente de satisfaire la dépendance export class MyComponent { constructor(private logger: LoggerService) { // L'instance de logger est fournie par l'injecteur d'Angular this.logger.log('Composant initialisé.'); } }