지시문에서 양방향 바인딩에 대한 $ watch가 호출되지 않았습니다.

Question

간단한 페이지 매김 지시문을 만들려고합니다. 아이디어는 내가 범주를 기반으로 동적 테이블을 가지고있다. 예 : 범주 -> 과일, 테이블 애플, 바나나있을 것이다, 오렌지 등 카테고리 -> 야채, 테이블 시금치, 콜리 플라워를해야합니다 그래서

에 내가 동적 매기기 지시어

을 구축을 위해 노력하고있다 NUMPAGES 때마다 사용자 선택으로 변경되었습니다 사용

<div my-paginator num-pages='numPages' display-page='currPage'></div> 

myApp.directive("myPaginator",function(){ 
    return { 
     restrict:"AE", 
    replace:true, 
     scope:{ 
      displayPage :"=", 
     numPages : "=" 
     }, 
     link:function(scope, element, attrs, ctrl){     

     scope.$watch(scope.numPages, function(){ 
      console.log("New num pages:"+scope.numPages); 
      scope.nPages = parseInt(scope.numPages,10);  
      scope.pages=[]; 
      for (var i=0;i<scope.nPages;i++) { 
       scope.pages.push({value:''+(i+1),text:'Page '+(i+1)}); 
      } 
     }, true); 
     console.log("Watch is bound"); 

     }, 
     controller:function($scope){   
      $scope.onPrevClick=function(newIndex){ 
       $scope.displayPage = $scope.displayPage -1; 
      } 

      $scope.onNextClick=function(newIndex){ 
       $scope.displayPage = $scope.displayPage +1; 
      } 

     $scope.onFirstClick=function(newIndex){ 
       $scope.displayPage = 1; 
      } 

      $scope.onPrevClick=function(newIndex){ 
       $scope.displayPage = $scope.numPages; 
      } 

     }, 
     template:"<div style='clear:both' class='pagination'><ul >"+ 
     "<li> <a ng-click=\"\">First</a></li>"+ 
     "<li ><a ng-click=\"\">Previous</a></li>"+ 
     "<li ><a ng-click=\"\">Page :<select ng-model='displayPage' "+ 
     " ng-options='option.value as option.text for option in pages' ng-change=\"gotoPage()\">"+ 
     "</select></a></li>"+ 
     "<li ><a ng-click=\"\">Next</a></li>"+ 
     "<li ><a ng-click=\"\">Last</a></li>"+ 
       "</ul></div>" 
    }; 

}) 

아래 코드는 새로운 카테고리. 내가 직면하고 문제는 NUMPAGES에 $ 시계가 값이 범위 요소를보기 위해 표

Answer 1

에서 구문을 변경하는 경우에도 호출되지

scope.$watch('numPages', function() { 
    // ... 
});