fix(radio): fix onChange error

ionic/components/checkbox/checkbox.ts

@@ -1,4 +1,4 @@
-import {Component, Directive, Optional, ElementRef, Renderer, HostListener} from 'angular2/core';
+import {Component, Directive, Optional, ElementRef, Input, Renderer, HostListener} from 'angular2/core';
 import {NgControl} from 'angular2/common';
 
 import {Ion} from '../ion';
@@ -24,16 +24,10 @@ import {Form} from '../../util/form';
  */
 @Component({
   selector: 'ion-checkbox',
-  inputs: [
-    'value',
-    'checked',
-    'disabled',
-    'id'
-  ],
   host: {
     'role': 'checkbox',
-    'tappable': '',
     'class': 'item',
+    'tappable': '',
     'tabindex': 0,
     '[attr.aria-disabled]': 'disabled'
   },
@@ -48,6 +42,10 @@ import {Form} from '../../util/form';
     '</div>'
 })
 export class Checkbox {
+  @Input() value: string = '';
+  @Input() public checked: any = false;
+  @Input() disabled: boolean = false;
+  @Input() id: string;
 
   constructor(
     private _form: Form,
@@ -98,8 +96,6 @@ export class Checkbox {
 
   /**
    * @private
-   * Click event handler to toggle the checkbox checked state.
-   * @param {MouseEvent} ev  The click event.
    */
   @HostListener('click', ['$event'])
   _click(ev) {

ionic/components/radio/radio.ts

@@ -26,13 +26,11 @@ import {isDefined} from '../../util/util';
 @Component({
   selector: 'ion-radio',
   host: {
-    '[attr.id]': 'id',
-    '[attr.aria-disabled]': 'disabled',
-    '[attr.aria-labelledby]': 'labelId',
-    'class': 'item',
     'role': 'radio',
+    'class': 'item',
     'tappable': '',
-    'tabindex': '0'
+    'tabindex': 0,
+    '[attr.aria-disabled]': 'disabled'
   },
   template:
     '<div class="item-inner">' +
@@ -53,10 +51,11 @@ export class RadioButton {
 
   labelId: any;
 
-  constructor(private _form: Form, private _renderer: Renderer, private _elementRef: ElementRef) {
+  constructor(
-    this._renderer = _renderer;
+    private _form: Form,
-    this._elementRef = _elementRef;
+    private _renderer: Renderer,
-  }
+    private _elementRef: ElementRef
+  ) {}
 
   /**
    * @private
@@ -64,8 +63,10 @@ export class RadioButton {
   ngOnInit() {
     if (!this.id) {
       this.id = 'rb-' + this._form.nextId();
+      this._renderer.setElementAttribute(this._elementRef, 'id', this.id);
     }
     this.labelId = 'lbl-' + this.id;
+    this._renderer.setElementAttribute(this._elementRef, 'aria-labelledby', this.labelId);
 
     let checked = this.checked;
     if (typeof checked === 'string') {
@@ -78,8 +79,8 @@ export class RadioButton {
   /**
    * @private
    */
-  @HostListener('click', ['$event'])
+  @HostListener('click')
-  private onClick(ev) {
+  private _click() {
     console.debug('RadioButton, select', this.value);
     this.select.emit(this);
   }
@@ -151,12 +152,15 @@ export class RadioGroup {
   id: any;
   value: any;
 
-  constructor(@Optional() private ngControl: NgControl, private _renderer: Renderer, private _elementRef: ElementRef) {
+  constructor(
-    this.ngControl = ngControl;
+    @Optional() ngControl: NgControl,
+    private _renderer: Renderer,
+    private _elementRef: ElementRef
+  ) {
     this.id = ++radioGroupIds;
 
     if (ngControl) {
-      this.ngControl.valueAccessor = this;
+      ngControl.valueAccessor = this;
     }
   }
 
@@ -225,7 +229,7 @@ export class RadioGroup {
         button.isChecked = isChecked;
         if (isChecked) {
           this.writeValue(button.value);
-          this.onChange(button.value);
+          //this.onChange(button.value);
           this._renderer.setElementAttribute(this._elementRef, 'aria-activedescendant', button.id);
         }
       }

ionic/components/toggle/toggle.ts

@@ -1,4 +1,4 @@
-import {Component, ElementRef, Renderer, HostListener, Optional} from 'angular2/core';
+import {Component, ElementRef, Renderer, Input, HostListener, Optional} from 'angular2/core';
 import {NgControl} from 'angular2/common';
 
 import {Form} from '../../util/form';
@@ -46,16 +46,10 @@ import {pointerCoord} from '../../util/dom';
  */
 @Component({
   selector: 'ion-toggle,ion-switch',
-  inputs: [
-    'value',
-    'checked',
-    'disabled',
-    'id'
-  ],
   host: {
     'role': 'checkbox',
-    'tappable': '',
     'class': 'item',
+    'tappable': '',
     'tabindex': 0,
     '[attr.aria-disabled]': 'disabled',
     '(touchstart)': 'pointerDown($event)',
@@ -75,6 +69,10 @@ import {pointerCoord} from '../../util/dom';
     `</div>`
 })
 export class Toggle {
+  @Input() value: string = '';
+  @Input() public checked: any = false;
+  @Input() disabled: boolean = false;
+  @Input() id: string;
 
   constructor(
     private _form: Form,