격리 된 범위 안의 각도 클릭은 범위 밖에서 함수를 호출합니다.

angular.ui tabset 지시문을 사용하고 있습니다. 나는 transclude를 사용하고 격리 된 범위를 가지고 있지만 다음과 같은 행동을 이해하지 못합니다.격리 된 범위 안의 각도 클릭은 범위 밖에서 함수를 호출합니다.

지시문 안에 ng-model을 설정하면 각이 지시어 범위에 바인딩됩니다. 그게 내가 기대했던 것인데, ng-click (지시어 내에서)을 사용하여 호출하면 outter scope 함수가 호출됩니다.

아무도 나를 이해할 수 있습니까?

<html data-ng-app="test"> 
    <head> 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.js"></script> 
    <script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.11.2.js"></script> 
    <link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet"> 
    </head> 
    <body> 

<div data-ng-controller="Ctrl"> 
Outter scope id: {{ $id }} 

    <tabset> 
    <tab heading="Tab 1"> 
     <p>Inner scope id: {{ $id }}</p> 

     <input type="text" data-ng-model="name" /> 
     <p>This model is bound on inner scope: {{ name }}</p> 

     <p> 
      <button data-ng-click="foo()">Invoke Foo</button> 
      This button is inside inner scope but invokes foo() on outter scope. 
     </p> 
    </tab> 
    </tabset> 

</div> 
</body> 
</html>

과 자바 스크립트 코드 :

angular.module('test', ['ui.bootstrap']).controller('Ctrl', function ($scope) { 
    $scope.name = "Test"; 

    $scope.foo = function() { 
     alert($scope.$id + ' - ' + $scope.name); 
    } 
});

감사합니다.

출처

2014-10-22 Fábio Gibson

난 아직 정확히하지 않는 당신이 무엇을하는 데 문제가 교부? JSFiddle에 코드를 삽입하면 예상대로 작동합니다. "002 - Test2"와 함께 경고 메시지가 나타납니다. –