From 016ba5c9368a2331856e04f80cea7a81f5058e30 Mon Sep 17 00:00:00 2001
From: Andrew Seguin <andrewseguin@users.noreply.github.com>
Date: Sun, 23 Sep 2018 09:12:54 -0700
Subject: [PATCH] fix(paginator): getNumberOfPages off by one (#10724)

Based off of #10720 (adding the demo page)

Changes the paginator's `getNumberOfPages` such that it returns the actual number of pages that are on the paginator rather than the max page index. This better matches the method name and description.

E.g. right now if you have one page, the function returns `0` rather than `1`, which is unexpected.

Fixes #10699
---
 src/demo-app/paginator/paginator-demo.html |  4 +++-
 src/lib/paginator/paginator.spec.ts        | 17 +++++++++++++++++
 src/lib/paginator/paginator.ts             | 12 ++++++++----
 3 files changed, 28 insertions(+), 5 deletions(-)

diff --git a/src/demo-app/paginator/paginator-demo.html b/src/demo-app/paginator/paginator-demo.html
index b011fbab482..d75b72294f9 100644
--- a/src/demo-app/paginator/paginator-demo.html
+++ b/src/demo-app/paginator/paginator-demo.html
@@ -22,7 +22,8 @@
     <mat-slide-toggle [(ngModel)]="showFirstLastButtons">Show first/last buttons</mat-slide-toggle>
   </div>
 
-  <mat-paginator (page)="handlePageEvent($event)"
+  <mat-paginator #paginator
+                 (page)="handlePageEvent($event)"
                  [length]="length"
                  [pageSize]="pageSize"
                  [showFirstLastButtons]="showFirstLastButtons"
@@ -32,4 +33,5 @@
   </mat-paginator>
 
   <div> Output event: {{pageEvent | json}} </div>
+  <div> getNumberOfPages: {{paginator.getNumberOfPages()}} </div>
 </mat-card>
diff --git a/src/lib/paginator/paginator.spec.ts b/src/lib/paginator/paginator.spec.ts
index 20a4ab6d23d..f3a2b3e08b2 100644
--- a/src/lib/paginator/paginator.spec.ts
+++ b/src/lib/paginator/paginator.spec.ts
@@ -338,6 +338,23 @@ describe('MatPaginator', () => {
     }));
   });
 
+  it('should keep track of the right number of pages', () => {
+    component.pageSize = 10;
+    component.length = 100;
+    fixture.detectChanges();
+    expect(paginator.getNumberOfPages()).toBe(10);
+
+    component.pageSize = 10;
+    component.length = 0;
+    fixture.detectChanges();
+    expect(paginator.getNumberOfPages()).toBe(0);
+
+    component.pageSize = 10;
+    component.length = 10;
+    fixture.detectChanges();
+    expect(paginator.getNumberOfPages()).toBe(1);
+  });
+
   it('should show a select only if there are multiple options', () => {
     expect(paginator._displayedPageSizeOptions).toEqual([5, 10, 25, 100]);
     expect(fixture.nativeElement.querySelector('.mat-select')).not.toBeNull();
diff --git a/src/lib/paginator/paginator.ts b/src/lib/paginator/paginator.ts
index 8e64a790e5c..4c71f6e7b45 100644
--- a/src/lib/paginator/paginator.ts
+++ b/src/lib/paginator/paginator.ts
@@ -190,7 +190,7 @@ export class MatPaginator extends _MatPaginatorBase implements OnInit, OnDestroy
     if (!this.hasNextPage()) { return; }
 
     const previousPageIndex = this.pageIndex;
-    this.pageIndex = this.getNumberOfPages();
+    this.pageIndex = this.getNumberOfPages() - 1;
     this._emitPageEvent(previousPageIndex);
   }
 
@@ -201,13 +201,17 @@ export class MatPaginator extends _MatPaginatorBase implements OnInit, OnDestroy
 
   /** Whether there is a next page. */
   hasNextPage(): boolean {
-    const numberOfPages = this.getNumberOfPages();
-    return this.pageIndex < numberOfPages && this.pageSize != 0;
+    const maxPageIndex = this.getNumberOfPages() - 1;
+    return this.pageIndex < maxPageIndex && this.pageSize != 0;
   }
 
   /** Calculate the number of pages */
   getNumberOfPages(): number {
-    return Math.ceil(this.length / this.pageSize) - 1;
+    if (!this.pageSize) {
+      return 0;
+    }
+
+    return Math.ceil(this.length / this.pageSize);
   }