AngularJS
제공 업체
수색…
통사론
- 상수 (이름, 값);
- 값 (이름, 값);
- 공장 (이름, $ getFn);
- 서비스 (이름, 생성자);
- 제공자 (이름, 제공자);
비고
제공자는 예를 들어 다른 서비스, 컨트롤러 및 지시문에 삽입 할 수있는 단일 객체입니다. 모든 공급자는 다른 "조리법"을 사용하여 등록됩니다. Provider 는 가장 유연한 Provider 입니다. 가능한 모든 요리법은 다음과 같습니다.
- 일정한
- 값
- 공장
- 서비스
- 공급자
서비스, 팩토리 및 프로 바이더는 모두 초기화가 지연되며, 애플리케이션이 애플리케이션에 의존하는 경우에만 구성 요소가 초기화됩니다.
Decorators 는 Providers와 밀접한 관련이 있습니다. 데코레이터는 서비스 또는 공장 생성을 가로 챌거나 동작을 바꾸기 위해 사용됩니다.
일정한
Constant 는 구성 및 실행 단계에서 모두 사용할 수 있습니다.
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>
값
Value 은 구성 및 실행 단계에서 모두 사용할 수 있습니다.
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>
공장
Factory 가동 단계에서 사용할 수 있습니다.
팩토리 제조법은 0 개 이상의 인수 (다른 서비스에 대한 종속성)가있는 함수를 사용하여 새 서비스를 생성합니다. 이 함수의 반환 값은이 래서 피에 의해 생성 된 서비스 인스턴스입니다.
팩토리는 프리미티브, 객체 리터럴, 함수 또는 사용자 정의 유형의 인스턴스 등 모든 유형의 서비스를 만들 수 있습니다.
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>
서비스
Service 는 실행 단계에서 사용할 수 있습니다.
서비스 레서피는 값 또는 공장 레시피와 마찬가지로 서비스를 생성하지만 new 연산자로 생성자를 호출하여 수행 합니다. 생성자는이 유형의 인스턴스에 필요한 종속성을 나타내는 0 개 이상의 인수를 가질 수 있습니다.
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>
공급자
Provider 는 구성 및 실행 단계에서 사용할 수 있습니다.
공급자 레시피는 구문 적으로
$get메소드를 구현하는 사용자 정의 유형으로 정의됩니다.애플리케이션을 시작하기 전에 만들어야하는 애플리케이션 전반의 구성을 위해 API를 공개하고자 할 때만 제공자 레시피를 사용해야합니다. 이는 대개 응용 프로그램간에 동작이 약간 다를 수있는 재사용 가능한 서비스에만 유용합니다.
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>
config 단계가 없으면 결과가
endpoint = n / a