AngularJS
Dostawcy
Szukaj…
Składnia
- stała (nazwa, wartość);
- wartość (nazwa, wartość);
- fabryka (nazwa, $ getFn);
- usługa (nazwa, konstruktor);
- dostawca (nazwa, dostawca);
Uwagi
Dostawcy są obiektami singletonowymi, które można wstrzykiwać, na przykład, do innych usług, kontrolerów i dyrektyw. Wszyscy dostawcy są rejestrowani przy użyciu różnych „przepisów”, przy czym Provider
jest najbardziej elastyczny. Wszystkie możliwe przepisy to:
- Stały
- Wartość
- Fabryka
- Usługa
- Dostawca
Usługi, fabryki i dostawcy są inicjowane z opóźnieniem, komponent jest inicjowany tylko wtedy, gdy aplikacja jest od niego zależna.
Dekoratorzy są ściśle związani z Dostawcami. Dekoratory służą do przechwytywania usługi lub tworzenia fabryki w celu zmiany jej zachowania lub zastąpienia (części).
Stały
Constant
jest dostępna zarówno w fazie konfiguracji, jak i uruchamiania.
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>
punkt końcowy = http: //some.rest.endpoint
Wartość
Value
jest dostępna zarówno w fazie konfiguracji, jak i uruchamiania.
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>
punkt końcowy = http: //some.rest.endpoint
Fabryka
Factory
jest dostępna w fazie uruchamiania.
Recepta fabryczna konstruuje nową usługę za pomocą funkcji z zerową lub większą liczbą argumentów (są to zależności od innych usług). Zwracana wartość tej funkcji jest instancją usługi utworzoną przez ten przepis.
Fabryka może utworzyć usługę dowolnego typu, bez względu na to, czy będzie to prymityw, dosłowność obiektu, funkcja, a nawet instancja typu niestandardowego.
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>
punkt końcowy = http: //some.rest.endpoint
Usługa
Service
jest dostępna w fazie uruchamiania.
Receptura usługi tworzy usługę podobną do receptury wartości lub fabryki, ale robi to przez wywołanie konstruktora z nowym operatorem . Konstruktor może przyjmować zero lub więcej argumentów, które reprezentują zależności wymagane przez instancję tego typu.
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>
punkt końcowy = http: //some.rest.endpoint
Dostawca
Provider
jest dostępny zarówno w fazie konfiguracji, jak i uruchamiania.
Receptura dostawcy jest zdefiniowana składniowo jako typ niestandardowy, który implementuje metodę
$get
.Z przepisu Provider należy korzystać tylko wtedy, gdy chcesz udostępnić interfejs API do konfiguracji w całej aplikacji, którą należy wykonać przed uruchomieniem aplikacji. Jest to zwykle interesujące tylko w przypadku usług wielokrotnego użytku, których zachowanie może wymagać nieznacznych zmian w zależności od aplikacji.
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>
punkt końcowy = http: //some.rest.endpoint
Bez fazy config
wynik byłby
punkt końcowy = nie dotyczy