Angularjs 의존 주입
2905 단어 AngularJS
function SomeClass(greeter) {
this.greeter = greeter;
}
SomeClass.prototype.greetName = function(name) {
this.greeter.greet(name);
};SomeClass는 실행할 때 내부의greeter에 접근할 수 있으나,greeter에 대한 인용을 얻는 데는 관심이 없습니다.greeter 실례에 대한 인용을 얻기 위해, SomeClass의 창설자는 의존 관계를 구축하고 전달하는 것을 책임진다.
이상의 이유로 AngularJS는 $injetor(주입기 서비스)를 사용하여 의존 관계의 조회와 실례화를 관리합니다.사실상 $injetor는 응용 모듈, 명령어, 컨트롤러 등을 포함한 AngularJS의 모든 구성 요소를 실례화하는 것을 책임진다.
예를 들어 아래의 이 코드.이것은 하나의 모듈과 하나의 컨트롤러를 설명하는 간단한 응용 프로그램입니다.
angular.module('myApp', [])
.factory('greeter', function() {
return {
greet: function(msg) {alert(msg);}
}
})
.controller('MyController',
function($scope, greeter) {
$scope.sayHello = function() {
greeter.greet("Hello!");
};
});AngularJS가 이 모듈을 실례화하면 greeter를 찾아 참조를 자연스럽게 전달합니다.
<div ng-app="myApp">
<div ng-controller="MyController">
<button ng-click="sayHello()">Hello</button>
</div>
</div>내부적으로 AngularJS의 처리 과정은 다음과 같습니다.
//
var injector = angular.injector(['ng', 'myApp']);
// $controller ：var $controller = injector.get('$controller');
var scope = injector.get('$rootScope').$new();
// ， AngularJS
var MyController = $controller('MyController', {$scope: scope})이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
AngularJS의 ng-options best practise쓸데없는 말은 하지 말고 바로 코드를 찍어라. 리소스를api에 직접 전달하지 말고 문자열이나 정형(예를 들어 귀속된ng-model="selected")을 권장합니다 angular에서 생성된 의value가 무엇인지, ...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
