Angular Academy · Leçon

Jetons d’injection

Injectez des valeurs qui ne sont pas des classes avec des jetons.

Jetons d’injection est une leçon Angular Academy gratuite sur CoddyKit. Ceci est la leçon 4 sur 4. Tu peux lire la leçon complète ci-dessous gratuitement — puis la pratiquer en direct dans le navigateur avec un éditeur de code intégré et un tuteur IA 24/7. Elle fait partie du parcours d'apprentissage Angular Academy, et ta progression se synchronise sur le web et l'application CoddyKit. Le cours Angular Academy comprend 4 leçons au total.

Jetons d’injection

Toutes les dépendances ne sont pas des classes. Pour injecter des valeurs comme des objets de configuration, des chaînes ou des interfaces, vous utilisez un InjectionToken comme clé unique.

Pourquoi utiliser des jetons

Les classes peuvent être utilisées directement comme clés de DI, mais les interfaces et les valeurs primitives ne le peuvent pas (les interfaces disparaissent à l’exécution). Un InjectionToken fournit une clé stable et typée pour ces cas.

Créer un jeton

Créez un jeton avec new InjectionToken<T>, en lui transmettant une description compréhensible.

import { InjectionToken } from '@angular/core';

export const API_URL = new InjectionToken<string>('API_URL');

Le paramètre de type

Le paramètre de type générique (ici string) attribue un type au jeton, afin que les valeurs injectées soient correctement typées.

Fournir une valeur à un jeton

Enregistrez le jeton avec une valeur en utilisant useValue dans un tableau de fournisseurs.

// bootstrapApplication(AppComponent, {
//   providers: [{ provide: API_URL, useValue: 'https://api.example.com' }]
// });

Injecter un jeton

Injectez le jeton avec la fonction inject pour obtenir sa valeur.

import { inject } from '@angular/core';
import { API_URL } from './tokens';

export class Api {
  private baseUrl = inject(API_URL);
}

Jetons pour la configuration

Un usage courant concerne la configuration de l’application : définissez une interface, créez un jeton typé avec celle-ci et fournissez un objet de configuration.

export interface AppConfig { title: string; retries: number; }
export const APP_CONFIG = new InjectionToken<AppConfig>('APP_CONFIG');

Fournir la configuration

Fournissez ensuite la valeur de configuration lors de l’amorçage.

// providers: [{ provide: APP_CONFIG, useValue: { title: 'My App', retries: 3 } }]

Valeurs par défaut avec une fabrique

Un jeton peut fournir une valeur par défaut via une fabrique dans ses options, afin de fonctionner même sans fournisseur explicite.

export const RETRIES = new InjectionToken<number>('RETRIES', {
  providedIn: 'root',
  factory: () => 3
});

Jetons ou classes

Utilisez une classe comme clé lorsque la dépendance est une classe de service. Utilisez un InjectionToken pour injecter des valeurs qui ne sont pas des classes : configurations, valeurs primitives ou objets typés par une interface.

Éviter les chaînes magiques

Les InjectionTokens remplacent les clés de chaîne fragiles par des identifiants typés et sans collision, ce qui permet de détecter les erreurs lors de la compilation.

Vérification rapide : jetons

Injecter des valeurs qui ne sont pas des classes.

Récapitulatif : jetons d’injection

Vous avez appris qu’InjectionToken fournit des clés typées pour injecter des valeurs qui ne sont pas des classes, comme des objets de configuration, des chaînes et des données typées par une interface. Créez-en un avec new InjectionToken, fournissez-le avec useValue ou une valeur par défaut produite par une fabrique, puis injectez-le avec inject(). Vous avez terminé le cours sur l’injection de dépendances.

Questions Fréquemment Posées

La leçon « Jetons d’injection » est-elle gratuite ?

Oui — le texte complet de « Jetons d’injection » est gratuit à lire ici sur le web. Pour la pratiquer de manière interactive (un éditeur de code intégré et un tuteur IA 24/7) et déverrouiller le reste du cours Angular Academy, passe à CoddyKit PRO. Le cours Angular Academy comprend 4 leçons au total.

Qu'est-ce que j'apprendrai dans « Jetons d’injection » ?

Injectez des valeurs qui ne sont pas des classes avec des jetons. Tu pratiques Angular Academy avec du code pratique que tu exécutes directement dans le navigateur, et un tuteur IA 24/7 répond à tes questions au fur et à mesure que tu avances dans la leçon.

Dois-je avoir de l'expérience pour commencer Angular Academy ?

Aucune expérience préalable n'est requise. Angular Academy sur CoddyKit est structuré pour les débutants jusqu'aux apprenants avancés, donc tu peux commencer ici ou depuis le début et avancer à ton rythme. Ceci est la leçon 4 sur 4.

Combien de temps prend la leçon « Jetons d’injection » ?

La plupart des leçons CoddyKit prennent environ 5–10 minutes. Chacune est courte et interactive, tu progresses régulièrement et tu repiques exactement où tu t'es arrêté sur le web et l'app.

Peux-tu écrire et exécuter du code dans cette leçon Angular Academy ?

Oui. Chaque leçon Angular Academy inclut un éditeur de code intégré, tu écris et exécutes du vrai code directement dans ton navigateur et tu reçois des retours IA instantanés — aucune configuration locale requise.

Toutes les leçons de ce cours

← Retour à Angular Academy