3

I have this codepen, and using the function '$scope.pageChanged' to see when a page is changed.

$scope.pageChanged = function() {
 $log.log('Page changed to: ' + $scope.currentPage);
};

But when I click on page links (changing a page), the variable '$scope.currentPage' doesn't changes. Why?

I think is something about the filter, but not sure.

robe007
  • 3,523
  • 4
  • 33
  • 59

1 Answers1

10

Change 

$scope.currentPage = 1;

to

$scope.pagination = {
    currentPage:  1
};

And as a consequence, it should be:

... pagination: pagination.currentPage
... ng-model="pagination.currentPage"
... $log.log('Page changed to: ' + $scope.pagination.currentPage);

You can group also other variables like maxSize in pagination. Avoid to bind primitives directly to the $scope.

Codepen

Michel
  • 26,600
  • 6
  • 64
  • 69
  • Thats awsome ! Why I have to make an object `$scope.pagination{}`? – robe007 Oct 17 '15 at 00:11
  • 2
    Basically this is because the variable is inherited in the pagination directive scope and changed from here. If you want more details about this problem you can see [this question](http://stackoverflow.com/questions/17606936/angularjs-dot-in-ng-model) – Michel Oct 17 '15 at 00:17
  • Thanks for pointing out the binding with primitive issue. But how come the demo works? https://angular-ui.github.io/bootstrap/#/pagination – Leo Huang Jun 03 '16 at 21:14