AngularJS 지시:링크 기능과 컴파일 기능은 함께 작동합니까?

AngularJS 지시:링크 기능과 컴파일 기능은 함께 작동합니까?

이 기능에 대해 몇 가지 의문이 있습니다.

예를 들어 다음과 같은 지시가 있다고 합시다.

.directive('hello', function () {
    return {
      template: '<div>Hello <span ng-transclude></span></div>',
      restrict: 'E',
      transclude: true,
      compile: function() {
        console.log('Compile()');

        return {
          pre: function() {
            console.log('PreLink()');
          },
          post: function() {
            console.log('PostLink()');
          }
        };
      },
      link: function postLink(scope, element, attrs) {
        console.log('Link()');
      }
    };
  }

템플릿에 다음과 같이 추가합니다.

<hello>World</hello>

콘솔 로그:

Compile()
PreLink()
PostLink()

그럼 왜?link()호출되지 않았나요?

오브젝트를 반환하는 대신compile()단일 기능 인쇄를 반환한다.PreLink()콘솔 로그:

Compile()
PreLink()

만약 내가 아무것도 돌려주지 않는다면Compile()콘솔 로그:

Compile()

여전히link()가 호출되지 않습니다.

코멘트만 하면Compile()그리고나서Link()드디어 인쇄되었습니다.

Link()

누가 이 모든 걸 설명해 줄 수 있나요?이다Link()그리고.Compile()같이 일하자는 거야?컴파일만 사용해야 하나요?PreLink()그리고.PostLink()?

link그리고.compile같이 일하지 않아, 아니야.

디렉티브 정의 오브젝트에서는link빈칸을 가진다는 뜻의 줄임말입니다.compile빈칸으로 기능하다preLink의 코드로 기능합니다.postLink기능.정의하는 즉시compile,link컴파일은 링크 함수를 반환해야 하기 때문에 angular에 의해 무시됩니다.

에서 1개의 함수만 반환하는 경우compile링크 후에 실행됩니다.

다르게 말하면link에 대한 지름길일 뿐입니다.postLink스코프가 링크된 후에 호출되는 함수compile.

여기에 기재되어 있습니다.코드 샘플의 코멘트를 봐 주세요.

며칠 전 위르겐 반 데 모에레에 의해 "Angular 내부 컴파일 및 링크 함수의 핵심"에 관한 멋진 기사가 발행되었습니다.JS 디렉티브"를 참조해 주세요.그것은 책임과 순서에 대해 꽤 명확하게 설명하고 있다.compile,pre-link그리고.post-link기능들.

_{(출처 : jvandemo.com )}

꼭 확인해 주세요.http://www.jvandemo.com/the-nitty-gritty-of-compile-and-link-functions-inside-angularjs-directives

언급URL : https://stackoverflow.com/questions/19797419/angularjs-directives-are-link-and-compile-functions-meant-to-work-together