AngularJS
providers
Zoeken…
Syntaxis
- constant (naam, waarde);
- waarde (naam, waarde);
- fabriek (naam, $ getFn);
- service (naam, constructor);
- provider (naam, provider);
Opmerkingen
Providers zijn singleton-objecten die bijvoorbeeld kunnen worden geïnjecteerd in andere services, controllers en richtlijnen. Alle providers worden geregistreerd met behulp van verschillende "recepten", waarbij Provider de meest flexibele is. Alle mogelijke recepten zijn:
- Constante
- Waarde
- Fabriek
- Onderhoud
- leverancier
Services, fabrieken en providers zijn allemaal lui geïnitialiseerd, component wordt alleen geïnitialiseerd als de toepassing ervan afhankelijk is.
Decorateurs zijn nauw verwant aan Providers. Decorateurs worden gebruikt om service of fabriekscreatie te onderscheppen om het gedrag te veranderen of (delen van) het te vervangen.
Constante
Constant is beschikbaar in zowel configuratie- als uitvoeringsfasen.
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>
eindpunt = http: //some.rest.endpoint
Waarde
Value is beschikbaar in zowel configuratie- als uitvoeringsfasen.
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>
eindpunt = http: //some.rest.endpoint
Fabriek
Factory is beschikbaar in run-fase.
Het fabrieksrecept maakt een nieuwe service met behulp van een functie met nul of meer argumenten (dit zijn afhankelijkheden van andere services). De retourwaarde van deze functie is het service-exemplaar dat door dit recept is gemaakt.
Factory kan van elk type een service maken, of het nu een primitieve, letterlijke object, functie of zelfs een exemplaar van een aangepast type is.
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>
eindpunt = http: //some.rest.endpoint
Onderhoud
Service is beschikbaar in de run-fase.
Het servicerecept produceert een service net zoals de recepten Waarde of Fabriek, maar het doet dit door een constructor met de nieuwe operator aan te roepen . De constructor kan nul of meer argumenten aannemen, die afhankelijkheden vertegenwoordigen die nodig zijn voor de instantie van dit type.
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>
eindpunt = http: //some.rest.endpoint
leverancier
Provider is beschikbaar in zowel configuratie- als run-fasen.
Het Provider-recept is syntactisch gedefinieerd als een aangepast type dat een
$getmethode implementeert.Gebruik het Provider-recept alleen als u een API wilt vrijgeven voor applicatie-brede configuratie die moet worden gemaakt voordat de applicatie start. Dit is meestal alleen interessant voor herbruikbare services waarvan het gedrag mogelijk enigszins moet variëren tussen applicaties.
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>
eindpunt = http: //some.rest.endpoint
Zonder config zou het config zijn
eindpunt = n.v.t.