Angular.js에서 다른 사람에게 주입할 수 있는 "물건"은 무엇입니까?
각도에서의 의존성 주입을 이해하는데 조금 어려움을 겪고 있어요.따라서 컨트롤러, 공장, 프로바이더 등 '타입' 중 어떤 것을 다른 '타입'에 삽입할 수 있는지 설명해 주실 수 있습니까?또, 같은 '타입'의 다른 인스턴스도 포함해서요.
제가 실제로 찾고 있는 것은 y/n으로 채워진 이 테이블입니다.행/열이 같은 셀의 경우, 즉 한 "유형"의 값을 동일한 "유형"의 다른 셀에 주입하는 것을 의미합니다.
+----------------+----------+------------+-----------+---------+--------+----------+---------+-------+
| Can we inject? | Constant | Controller | Directive | Factory | Filter | Provider | Service | Value |
+----------------+----------+------------+-----------+---------+--------+----------+---------+-------+
| Constant | | | | | | | | |
| Controller | | | | | | | | |
| Directive | | | | | | | | |
| Factory | | | | | | | | |
| Filter | | | | | | | | |
| Provider | | | | | | | | |
| Service | | | | | | | | |
| Value | | | | | | | | |
+----------------+----------+------------+-----------+---------+--------+----------+---------+-------+
설명 없이 '예'와 '아니오'로 표를 채우는 것이 아니라 좀 더 자세히 설명하겠습니다.
[마침내 메모 추가]결국...생각보다 오래 걸렸어요아래쪽에 tl;dr이 표시되어 있지만, 이 정보가 도움이 되었으면 합니다.]
[이 답변은 Angular에도 추가되었습니다]JS Wiki:의존관계 주입에 대해서]
프로바이더()$provide
$provide서비스는 Angular에게 새로운 주입 가능한 것을 작성하는 방법을 알려주는 역할을 합니다.이러한 것을 서비스라고 부릅니다.서비스는 프로바이더라고 불리는 것에 의해 정의됩니다.프로바이더는 프로바이더를 사용하여$provide는, 「」를 개입시켜 provider의 $provide하실 수 .$provide응용 하여 서비스를 합니다.config를 들어 경우가 있습니다.예를 들어 다음과 같습니다.
app.config(function($provide) {
$provide.provider('greeting', function() {
this.$get = function() {
return function(name) {
alert("Hello, " + name);
};
};
});
});
를 새로 greeting ; ;를 할 수 .greeting한 함수 등 더 설명)로 이행하면 Provider)를합니다(Angular는 Angular를 호출합니다.$get서비스의 새 인스턴스를 반환하기 위한 함수입니다.은 1의 1을 함수입니다.name 및 """alert는 이름에 기반한 메시지입니다.을 사용하다
app.controller('MainController', function($scope, greeting) {
$scope.onClick = function() {
greeting('Ford Prefect');
};
});
아, 아, 아, 아, 아, 맞다. factory,service , , , , 입니다.value모두 프로바이더의 다양한 부분을 정의하는 숏컷일 뿐입니다.즉, 프로바이더를 정의하기 위한 수단을 제공하는 것으로, 이러한 모든 것을 입력할 필요는 없습니다.예를 들어, 다음과 같이 정확하게 동일한 공급자를 쓸 수 있습니다.
app.config(function($provide) {
$provide.factory('greeting', function() {
return function(name) {
alert("Hello, " + name);
};
});
});
이해하는 것이 중요하기 때문에 바꿔서 설명하겠습니다.후드 밑의 앵귤러JS는 위에서 기술한 것과 동일한 코드를 호출하고 있습니다.$provide.provider버전)을 참조해 주세요.두 버전에는 말 그대로 100% 차이가 없습니다. value으로 동작합니다--만약 our our our our 에서 돌아오는 것이 무엇이든--------------------------------------------------------------------------------------------------------------------------------------------------------$getfactory은에 기능)을 사용하면 를 더 쓸 수 .을 사용하다value를 들어, 항상 를 반환하기 에, 이 함수는 되지 않습니다greetingservice 를 하면, 「」를 사용할 수 .value★★★★★★★★★★★★★★★★★★★★★:
app.config(function($provide) {
$provide.value('greeting', function(name) {
alert("Hello, " + name);
});
});
이것은 이 함수를 정의하는 데 사용한 다른 두 가지 방법과 100% 동일합니다. 입력 내용을 저장하는 방법일 뿐입니다.
일을 .app.config(function($provide) { ... })쓰고 있는 거.(상기 중 하나의 방법을 통해) 새로운 프로바이더를 정의하는 것은 매우 일반적이기 때문에 Angular는JS가 공개하는 것은$provider를 모듈오브젝트에더 입력을 할 수 있습니다.
var myMod = angular.module('myModule', []);
myMod.provider("greeting", ...);
myMod.factory("greeting", ...);
myMod.value("greeting", ...);
은 보다 할수록 같은 .app.config(...)이전 버전입니다.
제가 지금까지 빼먹은 주사기는constant'고될 것 같아요value한 가지 차이는 나중에 알게 될 것입니다.
이 코드들은 모두 같은 동작을 하고 있습니다.
myMod.provider('greeting', function() {
this.$get = function() {
return function(name) {
alert("Hello, " + name);
};
};
});
myMod.factory('greeting', function() {
return function(name) {
alert("Hello, " + name);
};
});
myMod.value('greeting', function(name) {
alert("Hello, " + name);
});
인젝터()$injector
는 델이 .$provide（ ( ( ( ( ( 。주입된 인수를 사용하는 함수를 작성할 때마다 주입기가 작동 중입니다. Angular JS 에는 1개의 JS가 .$injector되었을 때 하려면 , 「응용 프로그램」을 입력해 주세요.$injector주입 가능한 기능에 포함시킵니다(예,$injector스스로 주입하는 방법을 알고 있다!)
가 $injector하려면 , 「 」를 호출합니다.get서비스 이름이 적혀 있습니다.를 들어 '예'라고 하면,
var greeting = $injector.get('greeting');
greeting('Ford Prefect');
를 들어,의 「인젝터」를 하면, 있는 할 수 . 예를 들어, 인젝터의 기능을 사용하여 모든 기능에 서비스를 마법처럼 주입할 수 있습니다.invoke방법
var myFunction = function(greeting) {
greeting('Ford Prefect');
};
$injector.invoke(myFunction);
인젝터는 서비스 인스턴스를 한 번만 생성한다는 점에 유의하십시오.그런 다음 서비스 이름으로 공급자가 반환하는 모든 항목을 캐시합니다. 다음 번에 서비스를 요청할 때 동일한 개체를 실제로 얻을 수 있습니다.
따라서 질문에 답하기 위해 에서 호출되는 모든 함수에 서비스를 주입할 수 있습니다.여기에는 다음이 포함됩니다.
- 컨트롤러 정의 함수
- 지시 정의 함수
- 필터 정의 함수
$get'프로바이더factory★★★★★★★★★★★★★★★★★★」
★★constant §value는 항상 정적 값을 반환합니다.이러한 값은 인젝터를 통해 호출되지 않기 때문에 아무것도 주입할 수 없습니다.
프로바이더의 설정
은 왜 가 굳이 도 있다.provide if 법 factory,value, 등이 훨씬 더 쉬워졌습니다.정답은 공급자가 많은 구성을 허용한다는 것입니다.이미 언급한 바와 같이 공급자(또는 Angular가 제공하는 바로 가기 중 하나)를 통해 서비스를 생성하면 해당 서비스의 구성 방법을 정의하는 새로운 공급자가 생성됩니다.제가 말씀드리지 않은 것은 이 공급자들이 그 공급자들에게config응용 프로그램의 섹션과 상호 작용할 수 있습니다.
을 -,, 는단단단단단2 단단 단단단단2 단 first first first first first first first -- 。config ★★★★★★★★★★★★★★★★★」run★★★★★★config이미 살펴본 바와 같이 단계는 필요에 따라 모든 공급자를 설정할 수 있는 단계입니다.여기서 디렉티브, 컨트롤러, 필터 등이 설정됩니다.run짐작하시겠지만 국면은 Angular가 실제로 DOM을 컴파일하고 앱을 시작하는 곳입니다.
를 더 할 수 .myMod.config ★★★★★★★★★★★★★★★★★」myMod.run기능--각각의 기능은, 그 특정의 국면에서 실행되는 기능을 필요로 합니다. 바와 같이 할 수 있습니다. 즉, 된 기능을 했습니다.$provide서비스를 제공합니다.단, 주의할 점은 이 단계에서는 프로바이더만 투입할 수 있다는 것입니다(단,AUTO$provide ★★★★★★★★★★★★★★★★★」$injector를 참조해 주세요.
예를 들어, 다음이 허용되지 않습니다.
myMod.config(function(greeting) {
// WON'T WORK -- greeting is an *instance* of a service.
// Only providers for services can be injected in config blocks.
});
사용자가 액세스할 수 있는 서비스 제공업체는 다음과 같습니다.
myMod.config(function(greetingProvider) {
// a-ok!
});
중요한 예외가 있습니다. 바로 이 예외입니다.constant할 수 에 s의 내부에 할 수 .config 점)value 할 수 s. 름름 s s((((((((((((((((((((((((((((().Provider을 사용법
하면, 그는 「」라고 하는 이름이 .serviceProvider서, snowledge.service을 사용하다이제 프로바이더의 힘을 이용해서 더 복잡한 일을 할 수 있게 되었습니다.
myMod.provider('greeting', function() {
var text = 'Hello, ';
this.setText = function(value) {
text = value;
};
this.$get = function() {
return function(name) {
alert(text + name);
};
};
});
myMod.config(function(greetingProvider) {
greetingProvider.setText("Howdy there, ");
});
myMod.run(function(greeting) {
greeting('Ford Prefect');
});
에 '이로이이 now now now now now now 라는 기능이 있습니다.setText할 때 할 수 .alert에서 이 할 수 .; 에서 액세스 할 수 있습니다.config이 메서드를 호출하고 서비스를 커스터마이즈하려면 block을 선택합니다. ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★greeting커스터마이즈가 유효하게 된 것을 확인해 주세요.
이것은 보다 복잡한 예이기 때문에, 실전 데먼스트레이션은 다음과 같습니다.
컨트롤러()$controller
컨트롤러의 기능은 주입할 수 있지만 컨트롤러 자체는 다른 것에 주입할 수 없습니다.이는 컨트롤러가 공급자를 통해 생성되지 않기 때문입니다. Angular 서비스가 .$controller이치노했을 때myMod.controller(...)마지막 섹션과 마찬가지로 실제로 이 서비스 공급자에 액세스하고 있습니다.
예를 들어 다음과 같은 컨트롤러를 정의하는 경우:
myMod.controller('MainController', function($scope) {
// ...
});
실제로 하는 일은 다음과 같습니다.
myMod.config(function($controllerProvider) {
$controllerProvider.register('MainController', function($scope) {
// ...
});
});
해야 할 Angular는 Angular는 Angular를 합니다.$controller), 즉, 서비스를 합니다(서비스 사용).$injector컨트롤러 기능을 호출하여 종속성이 주입되도록 합니다).
필터 및 지시사항
filter ★★★★★★★★★★★★★★★★★」directive 작용하다controllerfilter 님은 고하하 called called called called called called called called called called called called called called called라는 서비스를 사용합니다.$filter그 프로바이더 「」의$filterProvider와 동시에 , 「」를 참조해 주세요.directive 님은 고하하 called called called called called called called called called called called called called called called라는 서비스를 사용합니다.$compile그 프로바이더 「」의$compileProvider 링크 부부: :
- $filter: https://docs.angularjs.org/api/ng/service/$filter
- $filterProvider: https://docs.angularjs.org/api/ng/provider/$filterProvider
- $180: https://docs.angularjs.org/api/ng/service/$compile
- $compile Provider: https://docs.angularjs.org/api/ng/provider/$compileProvider
예시와 로, 른른른 as as as as as as as as as as as as as as as.myMod.filter ★★★★★★★★★★★★★★★★★」myMod.directive는, 이러한 서비스를 설정하기 위한 쇼트 컷입니다.
「」, 「」와 함께 입니다.$injector.invoke 주입할 수 있습니다.여기에는 차트(이에 한정되지 않음)에서 다음과 같은 항목이 포함됩니다.
- 컨트롤러
- 지시의
- 공장
- 필터
- 「」
$get) ('프로바이더'는) - provider function(프로바이더를 컨스트럭터 함수로 정의하는 경우)
- 서비스
공급자는 사물에 주입할 수 있는 새로운 서비스를 만듭니다.여기에는 다음이 포함됩니다.
- 일정한
- 공장
- 프로바이더
- 서비스
- 가치
,, 음, 음, 음 등의 기본 제공 서비스입니다.$controller ★★★★★★★★★★★★★★★★★」$filter 이러한 서비스를 사용하여 이러한 방법으로 정의한 새로운 필터 및 컨트롤러를 입수할 수 있습니다(단, 정의한 것 자체로는 사물에 주입할 수 없는 경우도 있습니다).
에는, 인젝터에 기동되는 에도 프로바이더가 할 수 (「」외).또한 제한은 없습니다.config ★★★★★★★★★★★★★★★★★」run기기기기기기기있있있있있있있)
Binary Muse가 말하는 공급자, 공장, 서비스에 대한 놀라운 답변은 모두 매우 중요합니다.
다음은 그녀의 요점을 시각적으로 설명할 수 있는 이미지입니다.
(출처 : simplygoodcode.com )
Michelle의 훌륭한 답변입니다.지시사항을 주입할 수 있다는 것을 지적하고 싶습니다.명령어가 있는 경우myThing 이렇게 해서 주입할 수 있어요.myThingDirective: 다음은 의도된 예입니다.
위의 예는 그다지 실용적이지 않지만 디렉티브를 삽입하는 기능은 디렉티브를 장식할 때 유용합니다.
언급URL : https://stackoverflow.com/questions/16828287/what-things-can-be-injected-into-others-in-angular-js
'programing' 카테고리의 다른 글
| React 확인란이 onChange를 전송하지 않음 (0) | 2023.02.20 |
|---|---|
| JSON 문자열의 이진 데이터.Base64보다 뛰어난 기능 (0) | 2023.02.20 |
| ReactJS에서 중첩된 개체의 PropTypes를 검증하려면 어떻게 해야 합니까? (0) | 2023.02.20 |
| Keyclock에서 사용자 비밀번호를 변경하기 위한 API 호출이 있습니까? (0) | 2023.02.20 |
| 새 Postgre 내의 필드를 수정하려면 어떻게 해야 합니까?SQL JSON 데이터형? (0) | 2023.02.20 |