fix(pagination): retain model on initialization

- When `total-items` initializes as undefined, ignore value and do not update page information - Remove extra watcher and call action manually Closes #3786 Closes #4783 Fixes #2956
angular-ui · Oct 29, 2015 · 30099a0 · 30099a0 · Streebor · Oct 6, 2016
1 parent 167cfad
commit 30099a0
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 12 deletions.
diff --git a/src/pagination/pagination.js b/src/pagination/pagination.js
@@ -16,22 +16,16 @@ angular.module('ui.bootstrap.pagination', [])
       $scope.$parent.$watch($parse($attrs.itemsPerPage), function(value) {
         self.itemsPerPage = parseInt(value, 10);
         $scope.totalPages = self.calculateTotalPages();
+        updatePage();
       });
     } else {
       this.itemsPerPage = config.itemsPerPage;
     }
 
-    $scope.$watch('totalItems', function() {
-      $scope.totalPages = self.calculateTotalPages();
-    });
-
-    $scope.$watch('totalPages', function(value) {
-      setNumPages($scope.$parent, value); // Readonly variable
-
-      if ($scope.page > value) {
-        $scope.selectPage(value);
-      } else {
-        ngModelCtrl.$render();
+    $scope.$watch('totalItems', function(newTotal, oldTotal) {
+      if (angular.isDefined(newTotal) || newTotal !== oldTotal) {
+        $scope.totalPages = self.calculateTotalPages();
+        updatePage();
       }
     });
   };
@@ -71,6 +65,16 @@ angular.module('ui.bootstrap.pagination', [])
   $scope.noNext = function() {
     return $scope.page === $scope.totalPages;
   };
+
+  function updatePage() {
+    setNumPages($scope.$parent, $scope.totalPages); // Readonly variable
+
+    if ($scope.page > $scope.totalPages) {
+      $scope.selectPage($scope.totalPages);
+    } else {
+      ngModelCtrl.$render();
+    }
+  }
 }])
 
 .constant('uibPaginationConfig', {
@@ -111,7 +115,7 @@ angular.module('ui.bootstrap.pagination', [])
 
       // Setup configuration parameters
       var maxSize = angular.isDefined(attrs.maxSize) ? scope.$parent.$eval(attrs.maxSize) : paginationConfig.maxSize,
-          rotate = angular.isDefined(attrs.rotate) ? scope.$parent.$eval(attrs.rotate) : paginationConfig.rotate;
+        rotate = angular.isDefined(attrs.rotate) ? scope.$parent.$eval(attrs.rotate) : paginationConfig.rotate;
       scope.boundaryLinks = angular.isDefined(attrs.boundaryLinks) ? scope.$parent.$eval(attrs.boundaryLinks) : paginationConfig.boundaryLinks;
       scope.directionLinks = angular.isDefined(attrs.directionLinks) ? scope.$parent.$eval(attrs.directionLinks) : paginationConfig.directionLinks;
 

diff --git a/src/pagination/test/pagination.spec.js b/src/pagination/test/pagination.spec.js
@@ -734,3 +734,27 @@ describe('pagination directive', function() {
     });
   });
 });
+
+describe('pagination directive', function() {
+  var $compile, $rootScope, element;
+  beforeEach(module('ui.bootstrap.pagination'));
+  beforeEach(module('template/pagination/pagination.html'));
+  beforeEach(inject(function(_$compile_, _$rootScope_) {
+    $compile = _$compile_;
+    $rootScope = _$rootScope_;
+  }));
+
+  it('should retain the model value when total-items starts as undefined', function() {
+    $rootScope.currentPage = 5;
+    $rootScope.total = undefined;
+    element = $compile('<uib-pagination total-items="total" ng-model="currentPage"></uib-pagination>')($rootScope);
+    $rootScope.$digest();
+
+    expect($rootScope.currentPage).toBe(5);
+
+    $rootScope.total = 100;
+    $rootScope.$digest();
+
+    expect($rootScope.currentPage).toBe(5);
+  });
+});