2014-03-27 3 views
3

내 코드입니다 :AngularJS와 지침 controllerAs 구문 및 다음 범위

// HTML

<body> 
    <h1>{{foo.name}}</h1> 

    <my-directive></my-directive> 
</body> 

// 스크립트

app.directive('myDirective', function() { 
return { 
    restrict: 'E', 
    replace: true, 
    scope: true, //********** 
    template: '<h4>{{foo.name}}</h4>', 
    controllerAs: 'foo', 
    controller: fooCtrl, 
    link: function(scope) { 
     console.log(scope); 
    } 
} 
}); 

var fooCtrl = function() { 
    this.name = 'FOO'; 
} 

내 질문 :

내가 사용하는 경우 controllerAs 구문을 사용하고 범위를 설정하지 않습니다. myDirective에서 true이면 컨트롤러는 전역이되므로 제어기는 foo.name을 Tag에 삽입합니다. 하지만 일단 스코프를 true로 설정하면 컨트롤러는 myDirective에만 적용됩니다.

어떻게 이런 일이 일어 났습니까? 지시어 내부의 컨트롤러가 주변 범위를 상속하는 새로운 범위를 작성합니까? 왜 그것이 글로벌에 적용될 것인가? 난 항상 전에 범위를 분리 사용하므로 지침 내부 범위의 사용에 대해 잊지, 워드 프로세서를 읽고 명확하게 이해

UPDATE는

이것은 매우 어리석은 질문이다. 대답을 주셔서 감사합니다

답변

3

. directive documentation을 확인하고 scope 옵션에 대한 부분까지 조금 아래로 스크롤하십시오. 범위를 true로 설정하면 컨트롤러가 연결된 새 범위가 만들어집니다. scope를 설정하지 않으면 false로 설정되어 지시문에서 상위 범위를 사용하게됩니다. 이것이 컨트롤러가 상위 범위에 연결되는 이유입니다.

+0

고마워요, 존. 나는 지시어 내에서 컨트롤러가 범위에만 적용되고 범위를 true로 설정하면 지침의 범위 아래에 '하위'범위를 만들 것이라고 계속 생각했습니다. >. < – Neaped

5

당신이 각도 지시어의 범위 속성에 관해서 묻는 것 같아요. 또한 나는 당신이 $ rootScope를 '글로벌'이라는 용어로 사용한다고 가정합니다. 지시문에서 this guide에서 설명하고있는 바와 같이, 다음과 같이 범위 속성은 동작

지시문 하지만 공유 범위에 대한 새 범위를 만들지 않습니다 기본 옵션을 scope.false

scope.true 부모와

새로운 범위를 만들지 만 부모 범위에서 프로토 타입 적으로 상속됩니다.

범위 : '분리'

하지 않는 고립 된 범위를 생성은 prototypically 에서 부모 범위를 상속하지만 당신은 범위를 사용하여 부모 범위에 액세스 할 수 있습니다 $ 부모

+0

세부 정보를 보내 주셔서 감사합니다. 단 한 표 밖에 드릴 수 없습니다. < – Neaped