Make MdRadioButton OnPush

Author: tinayuangao

src/lib/radio/radio.ts

@@ -1,5 +1,7 @@
 import {
   AfterContentInit,
+  ChangeDetectionStrategy,
+  ChangeDetectorRef,
   Component,
   ContentChildren,
   Directive,
@@ -125,14 +127,31 @@ export class MdRadioGroup implements AfterContentInit, ControlValueAccessor {
   }
 
   /** Whether the labels should appear after or before the radio-buttons. Defaults to 'after' */
-  @Input() labelPosition: 'before' | 'after' = 'after';
+  _labelPosition: 'before' | 'after' = 'after';
+  @Input()
+  get labelPosition(): 'before' | 'after' {
+    return this._labelPosition;
+  }
+  set labelPosition(v: 'before' | 'after') {
+    this._labelPosition = v
+    if (this._radios) {
+      this._radios.forEach((radio) => {
+        radio.labelPosition = this._labelPosition;
+      });
+    }
+  }
 
   /** Whether the radio button is disabled. */
   @Input()
   get disabled(): boolean { return this._disabled; }
   set disabled(value) {
     // The presence of *any* disabled value makes the component disabled, *except* for false.
     this._disabled = (value != null && value !== false) ? true : null;
+    if (this._radios) {
+      this._radios.forEach((radio) => {
+        radio.disabled = this._disabled;
+      })
+    }
   }
 
   /** Value of the radio button. */
@@ -261,7 +280,8 @@ export class MdRadioGroup implements AfterContentInit, ControlValueAccessor {
   selector: 'md-radio-button, mat-radio-button',
   templateUrl: 'radio.html',
   styleUrls: ['radio.css'],
-  encapsulation: ViewEncapsulation.None
+  encapsulation: ViewEncapsulation.None,
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class MdRadioButton implements OnInit {
 
@@ -281,10 +301,26 @@ export class MdRadioButton implements OnInit {
   name: string;
 
   /** Used to set the 'aria-label' attribute on the underlying input element. */
-  @Input('aria-label') ariaLabel: string;
+  _ariaLabel: string;
+  @Input('aria-label')
+  get ariaLabel(): string {
+    return this._ariaLabel;
+  }
+  set ariaLabel(value: string) {
+    this._ariaLabel = value;
+    this._change.markForCheck();
+  }
 
   /** The 'aria-labelledby' attribute takes precedence as the element's text alternative. */
-  @Input('aria-labelledby') ariaLabelledby: string;
+  _ariaLabelledby: string;
+  @Input('aria-labelledby')
+  get ariaLabelledby(): string {
+    return this._ariaLabelledby;
+  }
+  set ariaLabelledby(value: string) {
+    this._ariaLabelledby = value;
+    this._change.markForCheck();
+  }
 
   /** Whether this radio is disabled. */
   private _disabled: boolean;
@@ -301,7 +337,10 @@ export class MdRadioButton implements OnInit {
   /** Whether the ripple effect for this radio button is disabled. */
   @Input()
   get disableRipple(): boolean { return this._disableRipple; }
-  set disableRipple(value) { this._disableRipple = coerceBooleanProperty(value); }
+  set disableRipple(value) {
+    this._disableRipple = coerceBooleanProperty(value);
+    this._change.markForCheck();
+  }
 
   /**
    * Event emitted when the checked state of this radio button changes.
@@ -317,6 +356,7 @@ export class MdRadioButton implements OnInit {
   constructor(@Optional() radioGroup: MdRadioGroup,
               private _elementRef: ElementRef,
               private _renderer: Renderer,
+              private _change: ChangeDetectorRef,
               public radioDispatcher: UniqueSelectionDispatcher) {
     // Assertions. Ideally these should be stripped out by the compiler.
     // TODO(jelbourn): Assert that there's no name binding AND a parent radio group.
@@ -358,6 +398,7 @@ export class MdRadioButton implements OnInit {
         // Notify all radio buttons with the same name to un-check.
         this.radioDispatcher.notify(this.id, this.name);
       }
+      this._change.markForCheck();
     }
   }
 
@@ -379,7 +420,7 @@ export class MdRadioButton implements OnInit {
           this.radioGroup.selected = this;
         }
       }
-
+      this._change.markForCheck();
     }
   }
 
@@ -396,6 +437,7 @@ export class MdRadioButton implements OnInit {
 
   set align(v) {
     this.labelPosition = (v == 'start') ? 'after' : 'before';
+    this._change.markForCheck();
   }
 
   private _labelPosition: 'before' | 'after';
@@ -408,6 +450,7 @@ export class MdRadioButton implements OnInit {
 
   set labelPosition(value) {
     this._labelPosition = value;
+    this._change.markForCheck();
   }
 
   /** Whether the radio button is disabled. */
@@ -420,6 +463,7 @@ export class MdRadioButton implements OnInit {
   set disabled(value: boolean) {
     // The presence of *any* disabled value makes the component disabled, *except* for false.
     this._disabled = (value != null && value !== false) ? true : null;
+    this._change.markForCheck();
   }
 
   ngOnInit() {