2

저는 AngularJS에 대한 경험이 있고 웹에서이 지시어를 보았습니다.하지만 이전에 본 적이 없으며 그 내용을 이해할 수 없습니까? 누구든지 도와 줄 수 있습니까?AngularJS :이 지침은 무엇을하고 있습니까?

특정 질문 : 지시 사항의 서명이 조금이라도 이해되면 종속성 주입을 수행해야합니다. 하지만 내가 고민하는 것은 다음과 같습니다. $ injector가 배열로 전달되면 함수에서 매개 변수로 전송되는 이유는 무엇입니까? 즉 function ($ injector); 다른 말로하면 왜 두 개의 $ injector가 있습니까? 배열에서 $ injector를 보내지 않으면 작동하지 않습니다.

또한이 지시문에 컨트롤러가 어떻게 포함되어 있습니까? 언제 그러한 컨트롤러를 정의합니까?

또한 일반적으로 아래 코드에서 $ 접두어로 범위를 볼 수 있습니다. $ 없이는 어떻게 작동합니까?

여기를 더 읽고 설명하는 링크는 유용 할 것입니다. 이 같은 기능, 즉 기능 ($ 인젝터)의 파라미터로서 전송되는 이유

.directive('mycomp', [ 
    '$injector', function($injector) { 
     var $builder, $compile, $drag; 
     $builder = $injector.get('$builder'); 
     $drag = $injector.get('$drag'); 
     $compile = $injector.get('$compile'); 
     return { 
     restrict: 'A', 
     scope: { 
      component: '=mycomp' 
     }, 
     controller: 'mycompController', 
     link: function(scope, element) { 
      scope.copyObjectToScope(scope.component); 
      $drag.draggable($(element), { 
      mode: 'mirror', 
      defer: false, 
      object: { 
       componentName: scope.component.name 
      } 
      }); 
      return scope.$watch('component.template', function(template) { 
      var view; 
      if (!template) { 
       return; 
      } 
      view = $compile(template)(scope); 
      return $(element).html(view); 
      }); 
     } 
     }; 
    } 
    ]) 

답변

4

; 다른 말로하면 왜 두 개의 $ injector가 있습니까?

배열 유형 주입을 수행 할 때 실제로 함수의 매개 변수가 호출되는 방법과 상관없이 배열 항목에 매핑됩니다. 예를 들어, 우리는

['$injector', function(a) {..}] 

매개 변수 a$injector 인스턴스에 매핑됩니다, 그리고 우리가있는 경우

['$injector', '$scope', function(a, b) {..}] 

a$injector 인스턴스에 매핑하고 b$scope 인스턴스에 매핑합니다. 여기서의 순서는 중요합니다. 자세히보기 : https://docs.angularjs.org/tutorial/step_05 in A 축소시 참고 사항 섹션.

$ injector를 배열에 보내지 않으면 작동하지 않는 것은 무엇입니까?

$ injector를 지정하지 않으면 위에 정의 된 $ injector가 정의되지 않습니다.

또한이 지시문에 컨트롤러가 어떻게 포함되어 있습니까? 언제 그러한 컨트롤러를 정의합니까?

일부 지시문은 필요한 경우 제어기를 가질 수 있지만 더 무거운 논리, $ 범위 바인딩 등을 포함해야합니다. 링크 함수는 실제로 $ element와의 상호 작용 만 보유해야합니다. 자세한 내용은 여기 : http://www.sitepoint.com/practical-guide-angularjs-directives/ 또한

나는 일반적으로 어떻게이 $없이 노력하고 있습니다 아래의 코드에서 $ 접두사와 범위를 볼 수?

이 경우 scope은 링크 기능에 사용되며 주사제가 아닙니다. 이 경우 컨트롤러 범위를 참조하는 간단한 변수 scope입니다.당신은 superBigVariableName이라고 부를 수 있으며 여전히 스코프를 참조하고 여전히 작동 할 것입니다. 링크 기능은 실제로 첫 번째 속성이 범위이고 두 번째 요소가 요소이고 세 번째 속성 인 간단한 함수입니다. 링크 함수에 서비스를 삽입 할 수 없습니다 (컨트롤러의 논리를 수행하십시오)

+0

매우 유용합니다. 잘 설명해 주셔서 감사합니다. 지시문에 컨트롤러를 삽입 할 때 더 복잡한 내용에 대한 좋은 링크를 제안 할 수 있습니까? (마지막 단락의 설명을 뒷받침 해줄 수 있습니다. – joatmom9

+1

어쩌면 여기에 : http://www.bennadel.com/blog/2446-using-controllers-in-directives-in-angularjs.htm 아주 일반적이지 잘 문서화 된 것은 아닙니다 : [[ – domakas

관련 문제