AngularJS : ng-repeat 범위

Question

일부 부분을 동적으로 포함하려고합니다. 이 작업을 수행하는 다른 방법이있을 수 있음을 알고 있지만이 방법이 왜 작동하지 않는지 이해하고 싶습니다.

내가 컨트롤러로 이렇게 정의가 :

auditApp.controllerModule.controller('LayoutCtrl', ['$scope', 
    function (scope) { 
     scope.index1={ 
      pages:[ 
       'views/subpage1.html', 
       'views/subpage2.html', 
       'views/subpage3.html', 
       'views/subpage4.html' 
     ]}; 
    } 
]); 

나는 내 코드의 정적 버전을 실행하면, 모든 작동합니다 :

<div ng-controller="LayoutCtrl"> 
    <div class="row" ng-init="pob={pageidx:0}"> 
     <div class="span1"> 
      <ul class="nav nav-tabs nav-stacked"> 
       <li><a ng-click="pob.pageidx=0">0</a></li> 
       <li><a ng-click="pob.pageidx=1">1</a></li> 
       <li><a ng-click="pob.pageidx=2">2</a></li> 
       <li><a ng-click="pob.pageidx=3">3</a></li> 
      </ul> 
     </div> 
     <div class="span11"> 
      <ng-include src="index1.pages[pob.pageidx]"></ng-include> 
     </div> 
    </div> 
</div> 

을 그러나, 나는 NG 사용하여이 중복하려고하면 -repeat, 자동으로 실패합니다.

<div ng-controller="LayoutCtrl"> 
    <div class="row" ng-init="pob={pageidx:0}"> 
     <div class="span1"> 
      <ul class="nav nav-tabs nav-stacked"> 
       <li ng-repeat="n in index1.pages"><a ng-click="pob.pageidx={{$index}}" >{{$index}}</a></li> 
      </ul> 
     </div> 
     <div class="span11"> 
      <ng-include src="index1.pages[pob.pageidx]"></ng-include> 
     </div> 
    </div> 
</div> 

다시 말하지만, 배열을 반복하면서 $ index 이 예제에서 전체적으로 많은 의미를 갖지는 않지만 근본적인 범위 차단은 나를 혼란스럽게합니다. 누구든지 내게 조언 할 수 있니?

Answer 1

ngClick은 각도 표현식을 예상합니다. 거기에 보간법을 사용해서는 안됩니다. 그것은 단순히해야한다 :

<a ng-click="pob.pageidx=$index">{{$index}}</a> 

http://plnkr.co/edit/ZSPdaqR6WrRh9rbP7vUU?p=preview