From e225da784605b96887e40686b568f539d11a8d4f Mon Sep 17 00:00:00 2001
From: Dmitriy Shekhovtsov <valorkin@gmail.com>
Date: Thu, 2 Nov 2017 16:32:29 +0200
Subject: [PATCH] fix(pagination): and pager to mark for check when page is
 changed (#2942)

---
 .../app/components/+pagination/demos/basic/basic.ts |  8 ++++----
 src/pagination/pager.component.ts                   | 13 ++++++-------
 src/pagination/pagination.component.ts              | 13 +++++++------
 3 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/demo/src/app/components/+pagination/demos/basic/basic.ts b/demo/src/app/components/+pagination/demos/basic/basic.ts
index fda2ccd541..2f99d33344 100644
--- a/demo/src/app/components/+pagination/demos/basic/basic.ts
+++ b/demo/src/app/components/+pagination/demos/basic/basic.ts
@@ -1,13 +1,13 @@
-import { Component } from '@angular/core';
+import { Component, Input } from '@angular/core';
 
 @Component({
   selector: 'demo-pagination-basic',
   templateUrl: './basic.html'
 })
 export class DemoPaginationBasicComponent {
-  totalItems: number = 64;
-  currentPage: number = 4;
-  smallnumPages: number = 0;
+  totalItems = 64;
+  currentPage = 4;
+  smallnumPages = 0;
 
   setPage(pageNo: number): void {
     this.currentPage = pageNo;
diff --git a/src/pagination/pager.component.ts b/src/pagination/pager.component.ts
index 6b5c5dbdcb..d1569234d8 100644
--- a/src/pagination/pager.component.ts
+++ b/src/pagination/pager.component.ts
@@ -6,7 +6,7 @@ import {
   Input,
   Output,
   EventEmitter,
-  forwardRef
+  forwardRef, ChangeDetectorRef
 } from '@angular/core';
 import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
 import { PageChangedEvent } from './pagination.component';
@@ -97,6 +97,7 @@ export class PagerComponent implements ControlValueAccessor, OnInit {
   set page(value: number) {
     const _previous = this._page;
     this._page = value > this.totalPages ? this.totalPages : value || 1;
+    this.changeDetection.markForCheck();
 
     if (_previous === this._page || typeof _previous === 'undefined') {
       return;
@@ -115,9 +116,6 @@ export class PagerComponent implements ControlValueAccessor, OnInit {
   onChange: any = Function.prototype;
   onTouched: any = Function.prototype;
 
-  renderer: Renderer2;
-  elementRef: ElementRef;
-
   classMap: string;
   pages: any[];
 
@@ -127,9 +125,10 @@ export class PagerComponent implements ControlValueAccessor, OnInit {
   protected inited = false;
   protected _page = 1;
 
-  constructor(renderer: Renderer2,
-              elementRef: ElementRef,
-              paginationConfig: PaginationConfig) {
+  constructor(private renderer: Renderer2,
+              private elementRef: ElementRef,
+              paginationConfig: PaginationConfig,
+              private changeDetection: ChangeDetectorRef) {
     this.renderer = renderer;
     this.elementRef = elementRef;
     if (!this.config) {
diff --git a/src/pagination/pagination.component.ts b/src/pagination/pagination.component.ts
index e52b5fff50..dd82c9f35a 100644
--- a/src/pagination/pagination.component.ts
+++ b/src/pagination/pagination.component.ts
@@ -6,7 +6,7 @@ import {
   OnInit,
   Output,
   Renderer2,
-  forwardRef
+  forwardRef, ChangeDetectorRef
 } from '@angular/core';
 import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
 
@@ -102,6 +102,7 @@ export class PaginationComponent implements ControlValueAccessor, OnInit {
   set page(value: number) {
     const _previous = this._page;
     this._page = value > this.totalPages ? this.totalPages : value || 1;
+    this.changeDetection.markForCheck();
 
     if (_previous === this._page || typeof _previous === 'undefined') {
       return;
@@ -119,8 +120,7 @@ export class PaginationComponent implements ControlValueAccessor, OnInit {
 
   onChange: any = Function.prototype;
   onTouched: any = Function.prototype;
-  renderer: Renderer2;
-  elementRef: ElementRef;
+
   classMap: string;
   pages: any[];
 
@@ -131,9 +131,10 @@ export class PaginationComponent implements ControlValueAccessor, OnInit {
   protected _page = 1;
 
   constructor(
-    renderer: Renderer2,
-    elementRef: ElementRef,
-    paginationConfig: PaginationConfig
+    private renderer: Renderer2,
+    private elementRef: ElementRef,
+    paginationConfig: PaginationConfig,
+    private changeDetection: ChangeDetectorRef
   ) {
     this.renderer = renderer;
     this.elementRef = elementRef;