Fournisseurs

Un fournisseur est une instruction donnée au système DI sur la manière d'obtenir une valeur pour une dépendance. La plupart du temps, ces dépendances sont des services que vous créez et fournissez.

Fournir un service

Si vous possédez déjà une application créée avec le CLI Angular, vous pouvez créer un service à l'aide de la commande ng generate du CLI dans le répertoire du projet racine. Remplacez User par le nom de votre service.

Cette commande crée le squelette UserService suivant :

Vous pouvez maintenant injecter UserService n'importe où dans votre application.

Le service lui-même est une classe générée par le CLI et décorée avec @Injectable. Par défaut, ce décorateur est configuré avec une propriété providedIn qui crée un fournisseur pour le service. Dans ce cas providedIn:'root' spécifie que le service doit être fourni dans l'injecteur de racine.

Portée du fournisseur

Lorsque vous ajoutez un fournisseur de services à l'injecteur d'application racine, il est disponible dans toute l'application. De plus, ces fournisseurs sont également disponibles pour toutes les classes de l'application tant qu'elles ont le jeton de recherche.

Vous devez toujours fournir votre service dans l'injecteur de racine, sauf si vous souhaitez que le service soit disponible uniquement si le consommateur importe un @NgModule particulier.

providedIn et NgModules

Il est également possible de spécifier qu'un service doit être fourni dans un @NgModule particulier. Par exemple, si vous ne voulez pas que UserService soit disponible pour les applications à moins qu'elles importent un UserModule que vous avez créé, vous pouvez spécifier que le service doit être fourni dans le module :

L'exemple ci-dessus montre la manière préférée de fournir un service dans un module. Cette méthode est préférée car elle permet de secouer le service si rien ne l'injecte. S'il n'est pas possible de spécifier dans le service quel module doit le fournir, vous pouvez également déclarer un fournisseur pour le service dans le module :

Limiter la portée du fournisseur par des modules de chargement différé

Dans l'application de base générée par la CLI, les modules sont chargés avec impatience, ce qui signifie qu'ils sont tous chargés lors du lancement de l'application. Angular utilise un système d'injection pour rendre les choses disponibles entre les modules. Dans une application chargée avec impatience, l'injecteur d'application racine rend tous les fournisseurs de tous les modules disponibles dans l'application.

Ce comportement change nécessairement lorsque vous utilisez le chargement différé. Le chargement paresseux consiste à charger des modules uniquement lorsque vous en avez besoin. par exemple, lors du routage. Ils ne sont pas chargés tout de suite comme avec des modules chargés avec impatience. Cela signifie que les services répertoriés dans les tableaux de leurs fournisseurs ne sont pas disponibles car l'injecteur racine ne connaît pas ces modules.

Lorsque le routeur Angular charge un module paresseux, il crée un nouvel injecteur. Cet injecteur est un enfant de l'injecteur d'application racine. Imaginez un arbre d'injecteurs; il existe un seul injecteur racine, puis un injecteur enfant pour chaque module paresseux chargé. Le routeur ajoute tous les fournisseurs de l'injecteur racine à l'injecteur enfant. Lorsque le routeur crée un composant dans le contexte paresseux, Angular préfère les instances de service créées à partir de ces fournisseurs aux instances de service de l'injecteur racine de l'application.

Tout composant créé dans le contexte d'un module chargé paresseux, tel que par la navigation par routeur, obtient l'instance locale du service, pas l'instance dans l'injecteur d'application racine. Les composants des modules externes continuent à recevoir l'instance créée pour la racine de l'application.

Bien que vous puissiez fournir des services avec des modules de chargement paresseux, tous les services ne peuvent pas être chargés paresseux. Par exemple, certains modules ne fonctionnent que dans le module racine, tel que le routeur. Le routeur fonctionne avec l'objet d'emplacement global dans le navigateur.

Limiter la portée du fournisseur avec des composants

Une autre façon de limiter la portée du fournisseur consiste à ajouter le service que vous souhaitez limiter au tableau providers du composant. Les fournisseurs de composants et les fournisseurs NgModule sont indépendants l'un de l'autre. Cette méthode est utile lorsque vous souhaitez charger avec impatience un module nécessitant un service pour lui-même. La fourniture d'un service dans le composant limite le service à ce composant (les autres composants du même module ne peuvent pas y accéder).

Fournir des services sous forme de modules ou de composants

En règle générale, fournissez les services dont l'application entière a besoin dans le module racine et les services d'étendue en les fournissant dans des modules chargés paresseux.

Le routeur fonctionne au niveau racine. Ainsi, si vous placez des fournisseurs dans un composant, même les modules AppComponent chargés paresseux, qui dépendent du routeur, ne peuvent pas les voir.

Enregistrez un fournisseur avec un composant lorsque vous devez limiter une instance de service à un composant et à son arborescence de composants, c'est-à-dire ses composants enfants. Par exemple, un composant d'édition utilisateur nécessitant UserEditorComponent une copie privée d'une mise en cache UserService doit être enregistré avec UserService, UserEditorComponent. Chaque nouvelle instance de UserEditorComponent obtient ensuite sa propre instance de service en cache.