chore: add ChangeDetectionStrategy.OnPush strategy

Close #5885

ionic/components/action-sheet/action-sheet.ts

@@ -1,4 +1,4 @@
-import {Component, Renderer, ElementRef, HostListener} from 'angular2/core';
+import {Component, Renderer, ElementRef, HostListener, ChangeDetectionStrategy} from 'angular2/core';
 import {NgFor, NgIf} from 'angular2/common';
 
 import {Animation} from '../../animations/animation';
@@ -186,7 +186,8 @@ export class ActionSheet extends ViewController {
     '[attr.aria-labelledby]': 'hdrId',
     '[attr.aria-describedby]': 'descId'
   },
-  directives: [NgFor, NgIf, Icon]
+  directives: [NgFor, NgIf, Icon],
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 class ActionSheetCmp {
   private d: any;

ionic/components/alert/alert.ts

@@ -1,4 +1,4 @@
-import {Component, ElementRef, Renderer, HostListener} from 'angular2/core';
+import {Component, ElementRef, Renderer, HostListener, ChangeDetectionStrategy} from 'angular2/core';
 import {NgClass, NgSwitch, NgIf, NgFor} from 'angular2/common';
 
 import {Animation} from '../../animations/animation';
@@ -308,7 +308,8 @@ export class Alert extends ViewController {
     '[attr.aria-labelledby]': 'hdrId',
     '[attr.aria-describedby]': 'descId'
   },
-  directives: [NgClass, NgSwitch, NgIf, NgFor]
+  directives: [NgClass, NgSwitch, NgIf, NgFor],
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 class AlertCmp {
   private activeId: string;

ionic/components/button/button.ts

@@ -1,4 +1,4 @@
-import {Component, ElementRef, Renderer, Attribute, Optional, Input} from 'angular2/core';
+import {Component, ElementRef, Renderer, Attribute, Optional, Input, ChangeDetectionStrategy} from 'angular2/core';
 
 import {Config} from '../../config/config';
 import {Toolbar} from '../toolbar/toolbar';
@@ -38,7 +38,8 @@ import {isTrueProperty} from '../../util/util';
     '<span class="button-inner">' +
       '<ng-content></ng-content>' +
     '</span>' +
-    '<ion-button-effect></ion-button-effect>'
+    '<ion-button-effect></ion-button-effect>',
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class Button {
   private _role: string = 'button'; // bar-button/item-button

ionic/components/content/content.ts

@@ -1,4 +1,4 @@
-import {Component, ElementRef, Optional, NgZone} from 'angular2/core';
+import {Component, ElementRef, Optional, NgZone, ChangeDetectionStrategy} from 'angular2/core';
 
 import {Ion} from '../ion';
 import {IonicApp} from '../app/app';
@@ -32,7 +32,8 @@ import {ScrollView} from '../../util/scroll-view';
       '<ng-content></ng-content>' +
     '</scroll-content>' +
     '<ng-content select="ion-fixed"></ng-content>' +
-    '<ng-content select="ion-refresher"></ng-content>'
+    '<ng-content select="ion-refresher"></ng-content>',
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class Content extends Ion {
   private _padding: number = 0;

ionic/components/item/item-sliding.ts

@@ -1,4 +1,4 @@
-import {Component, ElementRef, Optional} from 'angular2/core';
+import {Component, ElementRef, Optional, ChangeDetectionStrategy} from 'angular2/core';
 
 import {List} from '../list/list';
 
@@ -23,7 +23,7 @@ import {List} from '../list/list';
  *   </ion-item-sliding>
  * </ion-list>
  * ```
- * @demo /docs/v2/demos/item-sliding/  
+ * @demo /docs/v2/demos/item-sliding/
  * @see {@link /docs/v2/components#lists List Component Docs}
  * @see {@link ../../list/List List API Docs}
  */
@@ -31,7 +31,8 @@ import {List} from '../list/list';
   selector: 'ion-item-sliding',
   template:
     '<ng-content select="ion-item,[ion-item]"></ng-content>' +
-    '<ng-content select="ion-item-options"></ng-content>'
+    '<ng-content select="ion-item-options"></ng-content>',
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class ItemSliding {
 

ionic/components/item/item.ts

@@ -1,4 +1,4 @@
-import {Component, ContentChildren, forwardRef, ViewChild, ContentChild, Renderer, ElementRef} from 'angular2/core';
+import {Component, ContentChildren, forwardRef, ViewChild, ContentChild, Renderer, ElementRef, ChangeDetectionStrategy} from 'angular2/core';
 import {NgIf} from 'angular2/common';
 
 import {Button} from '../button/button';
@@ -57,7 +57,8 @@ import {Label} from '../label/label';
   host: {
     'class': 'item'
   },
-  directives: [NgIf, Label]
+  directives: [NgIf, Label],
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class Item {
   private _ids: number = -1;

ionic/components/loading/loading.ts

@@ -1,4 +1,4 @@
-import {Component, Renderer, ElementRef, HostListener} from 'angular2/core';
+import {Component, Renderer, ElementRef, HostListener, ChangeDetectionStrategy} from 'angular2/core';
 import {NgFor, NgIf} from 'angular2/common';
 
 import {Animation} from '../../animations/animation';
@@ -157,7 +157,8 @@ export class Loading extends ViewController {
   host: {
     'role': 'dialog'
   },
-  directives: [NgIf, Spinner]
+  directives: [NgIf, Spinner],
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 class LoadingCmp {
   private d: any;

ionic/components/menu/menu.ts

@@ -1,4 +1,4 @@
-import {Component, forwardRef, Directive, Host, EventEmitter, ElementRef, NgZone, Input, Output, Renderer} from 'angular2/core';
+import {Component, forwardRef, Directive, Host, EventEmitter, ElementRef, NgZone, Input, Output, Renderer, ChangeDetectionStrategy} from 'angular2/core';
 
 import {Ion} from '../ion';
 import {Config} from '../../config/config';
@@ -21,7 +21,8 @@ import {isTrueProperty} from '../../util/util';
   template:
     '<ng-content></ng-content>' +
     '<div tappable disable-activated class="backdrop"></div>',
-  directives: [forwardRef(() => MenuBackdrop)]
+  directives: [forwardRef(() => MenuBackdrop)],
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class Menu extends Ion {
   private _preventTime: number = 0;

ionic/components/scroll/scroll.ts

@@ -1,4 +1,4 @@
-import {Component, ElementRef} from 'angular2/core';
+import {Component, ElementRef, ChangeDetectionStrategy} from 'angular2/core';
 
 import {Ion} from '../ion';
 import {Gesture} from '../../gestures/gesture';
@@ -42,7 +42,8 @@ import * as util from '../../util';
       '<div class="scroll-zoom-wrapper">' +
         '<ng-content></ng-content>' +
       '</div>' +
-    '</scroll-content>'
+    '</scroll-content>',
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class Scroll extends Ion {
   /**

ionic/components/slides/slides.ts

@@ -1,4 +1,4 @@
-import {Directive, Component, ElementRef, Host, EventEmitter, Input, Output} from 'angular2/core';
+import {Directive, Component, ElementRef, Host, EventEmitter, Input, Output, ChangeDetectionStrategy} from 'angular2/core';
 import {NgClass} from 'angular2/common';
 
 import {Ion} from '../ion';
@@ -71,7 +71,8 @@ import {Scroll} from '../scroll/scroll';
       '</div>' +
       '<div [class.hide]="!showPager" class="swiper-pagination"></div>' +
     '</div>',
-  directives: [NgClass]
+  directives: [NgClass],
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class Slides extends Ion {
 
@@ -666,7 +667,8 @@ export class Slides extends Ion {
   */
 @Component({
   selector: 'ion-slide',
-  template: '<div class="slide-zoom"><ng-content></ng-content></div>'
+  template: '<div class="slide-zoom"><ng-content></ng-content></div>',
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class Slide {
 

ionic/components/spinner/spinner.ts

@@ -1,4 +1,4 @@
-import {Component, Input} from 'angular2/core';
+import {Component, Input, ChangeDetectionStrategy} from 'angular2/core';
 import {NgStyle} from 'angular2/common';
 
 import {Config} from '../../config/config';
@@ -110,7 +110,8 @@ import {Config} from '../../config/config';
   host: {
     '[class]': '_applied',
     '[class.spinner-paused]': 'paused'
-  }
+  },
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class Spinner {
   private _c: any[];

ionic/components/toolbar/toolbar.ts

@@ -1,4 +1,4 @@
-import {Component, Directive, Host, ElementRef, Optional, forwardRef, Inject, ContentChildren, ContentChild, QueryList} from 'angular2/core';
+import {Component, Directive, Host, ElementRef, Optional, forwardRef, Inject, ContentChildren, ContentChild, QueryList, ChangeDetectionStrategy} from 'angular2/core';
 
 import {Ion} from '../ion';
 import {MenuToggle} from '../menu/menu-toggle';
@@ -109,7 +109,8 @@ export class ToolbarBase extends Ion {
     '</div>',
   host: {
     'class': 'toolbar'
-  }
+  },
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class Toolbar extends ToolbarBase {
 
@@ -144,7 +145,8 @@ export class Toolbar extends ToolbarBase {
   template:
     '<div class="toolbar-title">' +
       '<ng-content></ng-content>' +
-    '</div>'
+    '</div>',
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class ToolbarTitle extends Ion {
   constructor(