2014-02-08 4 views
0

나는 같은 질문을했습니다. here과 해결책이 너무 효과적이었습니다. 그러나 스코프가 생성 될 때 내 머리를 감쌀 수는 없습니다. 아래 코드에서 $ modal 지시문에 새 범위가 만들어지면 modal.html (view) 및 ModalInstanceCtrl의 범위가 다른 이유는 무엇입니까? 같은 질문에서 코드의 아래 부분에서angularUI Bootstrap Modal을 사용하는 동안 새로운 스코프가 생성되는시기는 언제입니까?

:

$scope.open = function() { 
    var modalInstance = $modal.open({ 
     templateUrl: 'modal.html', 
     controller: 'ModalInstanceCtrl' 
    }); 

(주요 문제는 "텍스트"에서 $ 범위와 동일한 범위 객체에 없었다 = modal.html NG 모델에 있었다 그 컨트롤러 : ModalInstanceCtrl)

범위에 대해 이해할 수있는 것은 rootscope가 ng-app에 의해 처음 생성된다는 것입니다. 그런 다음 새 범위를 만드는 지시문에 의해 새 범위가 만들어집니다. fisrt에 왜,

유사성에도 불구
$routeProvider 
    .when('/', { 
     redirectTo: '/pages' 
    }) 
    .when('/food', { 
     templateUrl: 'food.html', 
     controller: 'foodController' 
    }) 
    .when('/play', { 
     templateUrl: 'play.html', 
     controller: 'playController' 
    }); 

, templateUrl (뷰) 및 컨트롤러 여기 범위 객체는 동일 :

주된 차이는 라우팅, 구조가 상기 코드와 유사한이었다 templateUrl (보기) 및 컨트롤러의 범위를 코드가 다릅니다? 참조 된 질문에서 대답의 주석은 중첩 된 컨트롤러로 인해 두 번째 코드에서 컨트롤러의 중첩이 없다는 것을 알았습니다. 처음에는 컨트롤러에 중첩되어 있습니다. 그러나 이것이 코드의 첫 번째 부분에서 뷰와 컨트롤러의 범위가 다르며 언제 새로운 범위가 만들어 졌는지 분명하지 않습니다.

답변

3

각진 응용 프로그램을 작성할 때 WTF 다시 작성. 이것이 나에게 일어 났을 때, 어딘가에서 "숨겨진"범위가 사용되고 있다는 느낌을 받았고 아마도 "모델에서 점 표기법을 선호합니다"라는 규칙을 잊어 버렸을 것입니다.

이 경우 html 소스를 확인하십시오. 귀하의 modal.html 콘텐츠는 <div class="modal-content" ng-transclude> 안에 있습니다. ModalInstanceCtrl의 범위를 상속 한 새로운 중첩 범위에 바인딩됩니다.

입력에 입력하면 범위에 직접 프리미티브를 할당해도 프로토 타입 체인을 참조하지 않으므로 새 텍스트 속성이 transcluded 범위에 추가됩니다. ModalInstanceCtrl의 범위는 참조되지 않습니다.

범위에있는 객체에 프리미티브를 지정하면 프로토 타입 체인을 참조하므로 점 표기 규칙을 사용합니다. 그게 당신의 참조 SO 문서는 여기 input.abc

와 함께 작동 왜 great SO article on prototypical inheritance and angular scopes

+0

매우, 완전한 정보 및 정확한 답이다! –

+0

아 ... 여기에서 ng-transclude 지시문은 새로운 범위를 만드는 범인입니다. 내가 한 가지 더 밝히고 싶은 것은 ModalDemoCtrl의 $ scope가 ModalInstanceCtrl의 $ scope와 같은가요? (제가 언급 한 질문에서) – Anubha

+0

아니요. 그들은 다릅니다. –

관련 문제