Qu’est-ce qu’un service Angular ?

Un service est un bout de code, une classe, qui peut contenir du code réutilisable, ou des données qu’on veut partager entre plusieurs composants.

Service = conteneur de code réutilisable

Le premier usage d’un service, c’est de stocker de la logique applicative réutilisable.

Un service Angular possède deux caractéristiques qui en font un candidat idéal pour cela :

  • C’est un singleton, c’est à dire qu’il n’existe qu’un seul exemplaire de chaque service pour toute l’application.
  • Il est global, c’est à dire accessible dans toute l’application.

Ainsi, dans une application Angular, on trouve souvent :

  • Un service qui gère l’authentification des utilisateurs.
  • Un service qui gère la communication avec la base de données.

En effet, ces fonctionnalités sont susceptibles d’être (ré)utilisées n’importe où dans l’application.

Service = conteneur de données partagées

Le deuxième usage d’un service est de stocker des données qu’on veut partager entre plusieurs parties de l’application.

Ici encore, les deux caractéristiques “singleton” et “accessible globalement” font du service un parfait outil pour les données partagées.

On pourrait par exemple :

  • Stocker l’utilisateur en cours dans un service d’authentification, car n’importe quelle partie de l’application est susceptible de vouloir y accéder.
  • Créer un service pour gérer le contenu du panier sur un site de e-commerce. Peut-être que l’ajout d’un article au panier depuis une page produit doit mettre à jour le nombre total d’articles dans le panier affiché en haut de page ; ce service permettrait de stocker le contenu du panier en un seul exemplaire et de le partager entre plusieurs parties de l’application (la page produit et l’icône du panier).