Parlez des différences entre les fournisseurs dans AngularJS

Tutoriels associés recommandés : "Tutoriel angulaire"

Qu'est-ce qu'un fournisseur ?

angularjs définition du document du fournisseur :

provider est un objet avec une méthode $get(). L'injecteur appelle la méthode $get pour créer une nouvelle instance de service. Le fournisseur dispose également d'autres méthodes qui peuvent être utilisées pour configurer le fournisseur.

AngularJS utilise $provide pour enregistrer de nouveaux fournisseurs. Les fournisseurs créent essentiellement une nouvelle instance, mais chaque fournisseur n'est créé qu'une seule fois. $provide Fournit 6 méthodes pour créer des fournisseurs personnalisés, je vais les expliquer respectivement avec des exemples de code simples.

Les 6 méthodes sont les suivantes :

• constante

• valeur

• service

• usine

• décorateur

• fournisseur

Constant

constant peut être injecté n'importe où. Constant ne peut pas être intercepté par le décorateur, ce qui signifie que la valeur de constant ne peut jamais être modifiée.

var app = angular.module('app', []); 
app.config(function ($provide) {
  $provide.constant('movieTitle', 'The Matrix');
}); 

app.controller('ctrl', function (movieTitle) {
  expect(movieTitle).toEqual('The Matrix');
});

AngularJS fournit un moyen plus simple de créer une constante. Vous pouvez réécrire les 3 à 5 lignes de code ci-dessus comme :

app.constant('movieTitle', 'The Matrix');

Value

value est une valeur simple qui peut être injectée, qui peut être une chaîne, un nombre ou une fonction.
La différence avec la constante est que la valeur ne peut pas être injectée dans les configurations, mais la valeur peut être interceptée par les décorateurs.

var app = angular.module('app', []); 
app.config(function ($provide) {
 $provide.value('movieTitle', 'The Matrix')
});

app.controller('ctrl', function (movieTitle) {
 expect(movieTitle).toEqual('The Matrix');
})

Un moyen simple de créer de la valeur :

app.value('movieTitle', 'The Matrix');

Service

service est un constructeur qui peut être injecté. Si vous le souhaitez, vous pouvez spécifier les dépendances requises dans la fonction.

Le service est un singleton et n'est créé qu'une seule fois. Les services constituent un bon moyen de transférer des données entre les contrôleurs, comme le partage de données.

var app = angular.module('app' ,\[\]); 
app.config(function ($provide) {
 $provide.service('movie', function () {
   this.title = 'The Matrix';
 });
});

app.controller('ctrl', function (movie) {
 expect(movie.title).toEqual('The Matrix');
});

Un moyen simple de créer un service :

app.service('movie', function () {
 this.title = 'The Matrix';
});

Factory

factory est une fonction injectable.

Identique à service : factory est également un singleton, et des dépendances peuvent également être spécifiées dans cette fonction.

La différence est la suivante : l'usine injecte une fonction normale, AngularJs appellera cette fonction et le service injecte un constructeur.

service est un constructeur qui appelle new pour créer un nouvel objet. Avec une usine, vous pouvez faire en sorte que la fonction renvoie tout ce que vous voulez.
Vous verrez que factory est un fournisseur avec uniquement la méthode $get.

var app = angular.module('app', []); 
app.config(function ($provide) {
 $provide.factory('movie', function () {
   return {
     title: 'The Matrix';
   }
 });
}); 

app.controller('ctrl', function (movie) {
 expect(movie.title).toEqual('The Matrix');
});

Un moyen simple de créer une usine :

app.factory('movie', function () {
 return {
   title: 'The Matrix';
 }
});

Decorator

decorator peut modifier ou encapsuler d'autres fournisseurs, mais constante Ne peut pas être décoré.

var app = angular.module('app', []); 
app.value('movieTitle', 'The Matrix'); 
app.config(function ($provide) {
 $provide.decorator('movieTitle', function ($delegate) {
   return $delegate + ' - starring Keanu Reeves';
 });
});

app.controller('myController', function (movieTitle) {
 expect(movieTitle).toEqual('The Matrix - starring Keanu Reeves');
});

Provider

Le fournisseur est le plus complexe de tous les fournisseurs et peut avoir des fonctions de création et des options de configuration complexes.

provider est en fait une usine configurable. Le fournisseur accepte un objet ou un constructeur.

var app = angular.module('app', []); 
app.provider('movie', function () {
 var version;
 return {
   setVersion: function (value) {
     version = value;
   },
   $get: function () {
     return {
       title: 'The Matrix' + ' ' + version
     }
   }
 }
});

app.config(function (movieProvider) {
 movieProvider.setVersion('Reloaded');
});

app.controller('ctrl', function (movie) {
 expect(movie.title).toEqual('The Matrix Reloaded');
});

Résumé

Tous les fournisseurs ne seront instanciés qu'une seule fois, ils sont donc tous des singletons.

Sauf constante, d'autres prestataires peuvent être décorés.

La constante est une valeur qui peut être injectée n'importe où et sa valeur ne peut pas être modifiée.

value est une simple valeur injectable.

service est un constructeur injectable.

factory est une fonction injectable.

Decorator peut modifier ou encapsuler d'autres fournisseurs, sauf constant.

provider est une usine configurable.

Adresse originale en anglais : https://xebia.com/blog/differences-between-providers-in-angularjs/

Recommandations associées : Enseignement de la programmation

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!