fix(paginator): update page index if invalid after length change

Updates the page index of a paginator if its length changed to something where the index isn't valid anymore (e.g. the user is on the last page and the amount of pages becomes smaller).

Fixes #14520.

Author: crisbeto

src/material/paginator/paginator.spec.ts

@@ -464,6 +464,30 @@ describe('MatPaginator', () => {
     expect(paginator.showFirstLastButtons).toBe(true);
   });
 
+
+  it('should update the page index when switching to a smaller length', fakeAsync(() => {
+    const fixture = createComponent(MatPaginatorApp);
+    const instance = fixture.componentInstance;
+    instance.length = 50;
+    instance.pageSize = 10;
+    instance.pageIndex = 4;
+    fixture.detectChanges();
+
+    expect(instance.paginator.pageIndex).toBe(4);
+
+    instance.pageEvent.calls.reset();
+
+    instance.length = 10;
+    fixture.detectChanges();
+    tick();
+
+    expect(instance.paginator.pageIndex).toBe(0);
+    expect(instance.pageEvent).toHaveBeenCalledWith(jasmine.objectContaining({
+      previousPageIndex: 4,
+      pageIndex: 0
+    }));
+  }));
+
 });
 
 function getPreviousButton(fixture: ComponentFixture<any>) {

src/material/paginator/paginator.ts

@@ -127,6 +127,18 @@ export class MatPaginator extends _MatPaginatorBase implements OnInit, OnDestroy
   get length(): number { return this._length; }
   set length(value: number) {
     this._length = coerceNumberProperty(value);
+
+    const maxPageIndex = Math.max(this.getNumberOfPages() - 1, 0);
+    const currentPageIndex = this._pageIndex;
+
+    if (currentPageIndex > maxPageIndex && this.initialized) {
+      // Needs to happen on the next tick, in order to avoid "changed after checked" errors.
+      Promise.resolve().then(() => {
+        this._pageIndex = maxPageIndex;
+        this._emitPageEvent(currentPageIndex);
+      });
+    }
+
     this._changeDetectorRef.markForCheck();
   }
   private _length = 0;