AngularJS
Proveedores
Buscar..
Sintaxis
- constante (nombre, valor);
- valor (nombre, valor);
- fábrica (nombre, $ getFn);
- servicio (nombre, constructor);
- proveedor (nombre, proveedor);
Observaciones
Los proveedores son objetos singleton que se pueden inyectar, por ejemplo, en otros servicios, controladores y directivas. Todos los proveedores están registrados con diferentes "recetas", donde el Provider
es el más flexible. Todas las recetas posibles son:
- Constante
- Valor
- Fábrica
- Servicio
- Proveedor
Los servicios, las fábricas y los proveedores están todos iniciados, el componente se inicializa solo si la aplicación depende de él.
Los decoradores están estrechamente relacionados con los proveedores. Los decoradores se utilizan para interceptar el servicio o la creación de fábrica para cambiar su comportamiento o anularlo (partes de).
Constante
Constant
está disponible tanto en la configuración como en las fases de ejecución.
angular.module('app',[])
.constant('endpoint', 'http://some.rest.endpoint') // define
.config(function(endpoint) {
// do something with endpoint
// available in both config- and run phases
})
.controller('MainCtrl', function(endpoint) { // inject
var vm = this;
vm.endpoint = endpoint; // usage
});
<body ng-controller="MainCtrl as vm">
<div>endpoint = {{ ::vm.endpoint }}</div>
</body>
punto final = http: //some.rest.endpoint
Valor
Value
está disponible tanto en la configuración como en las fases de ejecución.
angular.module('app',[])
.value('endpoint', 'http://some.rest.endpoint') // define
.run(function(endpoint) {
// do something with endpoint
// only available in run phase
})
.controller('MainCtrl', function(endpoint) { // inject
var vm = this;
vm.endpoint = endpoint; // usage
});
<body ng-controller="MainCtrl as vm">
<div>endpoint = {{ ::vm.endpoint }}</div>
</body>
punto final = http: //some.rest.endpoint
Fábrica
Factory
está disponible en la fase de ejecución.
La receta de Factory construye un nuevo servicio utilizando una función con cero o más argumentos (son dependencias de otros servicios). El valor de retorno de esta función es la instancia de servicio creada por esta receta.
Factory puede crear un servicio de cualquier tipo, ya sea primitivo, objeto literal, función o incluso una instancia de un tipo personalizado.
angular.module('app',[])
.factory('endpointFactory', function() {
return {
get: function() {
return 'http://some.rest.endpoint';
}
};
})
.controller('MainCtrl', function(endpointFactory) {
var vm = this;
vm.endpoint = endpointFactory.get();
});
<body ng-controller="MainCtrl as vm">
<div>endpoint = {{::vm.endpoint }}</div>
</body>
punto final = http: //some.rest.endpoint
Servicio
Service
está disponible en la fase de ejecución.
La receta de Servicio produce un servicio como las recetas de Valor o Fábrica, pero lo hace invocando a un constructor con el nuevo operador . El constructor puede tomar cero o más argumentos, que representan dependencias necesarias para la instancia de este tipo.
angular.module('app',[])
.service('endpointService', function() {
this.get = function() {
return 'http://some.rest.endpoint';
};
})
.controller('MainCtrl', function(endpointService) {
var vm = this;
vm.endpoint = endpointService.get();
});
<body ng-controller="MainCtrl as vm">
<div>endpoint = {{::vm.endpoint }}</div>
</body>
punto final = http: //some.rest.endpoint
Proveedor
Provider
está disponible tanto en la configuración como en las fases de ejecución.
La receta del proveedor se define sintácticamente como un tipo personalizado que implementa un método
$get
.Debe usar la receta del proveedor solo cuando desee exponer una API para la configuración de toda la aplicación que debe realizarse antes de que se inicie la aplicación. Por lo general, esto es interesante solo para los servicios reutilizables cuyo comportamiento puede necesitar variar ligeramente entre las aplicaciones.
angular.module('app',[])
.provider('endpointProvider', function() {
var uri = 'n/a';
this.set = function(value) {
uri = value;
};
this.$get = function() {
return {
get: function() {
return uri;
}
};
};
})
.config(function(endpointProviderProvider) {
endpointProviderProvider.set('http://some.rest.endpoint');
})
.controller('MainCtrl', function(endpointProvider) {
var vm = this;
vm.endpoint = endpointProvider.get();
});
<body ng-controller="MainCtrl as vm">
<div>endpoint = {{::vm.endpoint }}</div>
</body>
punto final = http: //some.rest.endpoint
Sin la fase de config
resultado sería
punto final = n / a