2014-10-29 2 views
0

나는 다르게 행동 할 것이라고 생각했던 아주 작은 예를 만들었습니다. 중첩 된 div 태그 두 개를 만들고 컨트롤러 ParentController 및 ChildController를 호출했습니다. 두 변수에 동일한 변수를 할당했습니다. ($ scope.mydata)내 AngularJS 스코프 이해가 필요합니다.

자녀를 변경하면 자식 만 업데이트되지만 부모를 변경하면 둘 다 업데이트된다는 것이 예상됩니다. . 다른 여기

plnkr는 : http://plnkr.co/edit/zETedNQiO1hwf3ucW7wG?p=preview

<html> 
<head> 
    <meta charset="utf-8"> 
    <title>misc1</title> 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script> 
    <link rel="stylesheet" href="jquery.cluetip.css" type="text/css"/> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
    <script src="script.js"></script> 
</head> 
<body ng-app="myapp" ng-controller="MainCtrl"> 

<div ng-controller="ParentController"> 
    <input ng-model="mydata" placeholder="Some Data"> 
    ... ParentController:mydata: {{ mydata }} 
    <div ng-controller="ChildController"> 
     <input ng-model="mydata" placeholder="Some Data"> 
     ... ChildController:mydata: {{ mydata }} 
    </div> 
</div> 

</body> 
</html> 

...

var app = angular.module('myapp', []); 
app.controller('MainCtrl', function ($scope) { 
}); 

app.controller('ParentController', function ($scope) { 
    $scope.mydata = 'parent data'; 
}); 
app.controller('ChildController', function ($scope) { 
    $scope.mydata = 'child data'; 
}); 
+0

은 [여기 링크]를 읽을 마크의 훌륭한 대답을 읽을 작품 (https://github.com/angular/angular.js/wiki/Understanding-Scopes) – harishr

답변

1

짧은 대답은 그 원형 inheritanc의 때문에 e 하위 범위는 부모 속성을 음영 처리합니다. 방법이의 깊이에 대한 이해를 돕기 위하여

What are the nuances of scope prototypal/prototypical inheritance in AngularJS?

+0

감사 , 나는 그것을 얻는다라고 생각한다. 이 인용문은 당신이 나에게 보낸 링크에서 그것을 설명한다고 생각합니다. "프로토 타입 체인은 참조되지 않고 새로운 aString 속성이 childScope에 추가됩니다.이 새 속성은 parentScope 속성을 동일한 이름으로 숨기거나 그림자를 드리며 아래의 ng-repeat 및 ng-include를 토론 할 때 매우 중요해질 것입니다. " –

관련 문제