각도 지시자에서 컨트롤러 함수에 하나 이상의 인수 전달

Question

지시어에서 컨트롤러에 정의 된 함수에 두 개의 인수를 전달해야합니다.

HTML

<div paginate="allResults" change-page="changePage()"></div> 

지침

app.directive('paginate', function() { 
    return { 
     scope: { 
      allResults: '=paginate', 
      changePage:'&' 
     }, 
     template: '<ul class="pagination" ng-show="totalPages > 1">' + 
      ' <li><a ng-click="firstPage()">&laquo;</a></li>' + 
      ' <li><a ng-click="prevPage()">&lsaquo;</a></li>' + 
      ' <li ng-repeat="n in pages">' + 
      ' <a class="current-{{n==current_page}}" ng-bind="n" ng-click="setPage(n)">1</a>' + 
      ' </li>' + 
      ' <li><a ng-click="nextPage()">&rsaquo;</a></li>' + 
      ' <li><a ng-click="last_page()">&raquo;</a></li>' + 
      '</ul>', 
     link: function (scope) { 
      scope.nextPage = function() { 
       if (scope.current_page < scope.totalPages) { 
        scope.current_page++; 
       } 
      }; 

      scope.prevPage = function() { 
       if (scope.current_page > 1) { 
        scope.current_page--; 
       } 
      }; 

      scope.firstPage = function() { 
       scope.current_page = 1; 
      }; 

      scope.last_page = function() { 
       scope.current_page = scope.totalPages; 
      }; 

      scope.setPage = function (page) { 
       scope.current_page = page; 
      }; 
      var paginate = function (results, oldResults) { 
       if (oldResults === results) return; 
       scope.current_page = results.current_page; 
       scope.total = results.total; 
       scope.totalPages = results.last_page; 
       scope.pages = []; 

       for (var i = 1; i <= scope.totalPages; i++) { 
        scope.pages.push(i); 
       } 
      }; 

      var pageChange = function (newPage, last_page) { 
       scope.changePage(newPage, last_page); 
      }; 

      scope.$watch('allResults', paginate); 
      scope.$watch('current_page', pageChange); 
     } 
    } 
}); 

컨트롤러

function CareerCtrl($scope, $http, Career) { 

    $scope.init = function() { 
     Career.get({}, function (response) { 

      $scope.careers = response.careers.data; 
      $scope.allResults = response.careers; 
     }, function (error) { 
      console.log(error); 
      $scope.careers = []; 
     }); 

    }; // init 

    $scope.changePage = function(newPage, last_page) { 
     console.log(newPage); 
     console.log(last_page); 
     if (newPage == last_page) return; 
     Career.get({ 
      page: newPage 
     }, function (response) { 
     angular.copy(response.careers.data,scope.allResults.data); 
     scope.allResults.current_page = response.careers.current_page; 
     }, function (error) { 
      console.log(error); 
      $scope.allResults.data = []; 
     }); 

    } 
} // Ctrl 

이제 컨트롤러에 newPage 및 last_page에 대해 undefined이 표시됩니다.

See my fiddle here

Answer 1

솔루션 온 (fiddle)

HTML :

<div paginate="allResults" change-page="changePage(newPage, last_page)"></div> 

지침 :

var pageChange = function (newPage, last_page) { 
    scope.changePage({ 
     newPage: newPage, 
     last_page: last_page 
    }); 
}; 

해결 방법 2 (fiddle) :

HTML :

<div paginate="allResults" change-page="changePage"></div> 

지침 : 당신이 컨트롤러 기능 $scope.changePage에 두 곳에서 $scope에 scope을 변경해야

var pageChange = function (newPage, last_page) { 
    var expressionHandler = scope.changePage(); 
    expressionHandler(newPage, last_page); 
}; 

참고하여 원래 바이올린.