diff --git a/ionic/components/radio/radio.ts b/ionic/components/radio/radio.ts index b1fbd5642a..04b3da4301 100644 --- a/ionic/components/radio/radio.ts +++ b/ionic/components/radio/radio.ts @@ -46,14 +46,16 @@ import {isDefined} from '../../util/util'; }) export class RadioButton { @Input() value: string = ''; - @Input() checked: boolean = false; + @Input() public checked: any = false; @Input() disabled: boolean = false; @Input() id: string; - @Output() select: EventEmitter = new EventEmitter(); + @Output() select: EventEmitter = new EventEmitter(); + + labelId: any; constructor(private _form: Form, private _renderer: Renderer, private _elementRef: ElementRef) { - this.isChecked = this.checked; - _renderer.setElementAttribute(_elementRef, 'checked', null); + this._renderer = _renderer; + this._elementRef = _elementRef; } /** @@ -64,6 +66,13 @@ export class RadioButton { this.id = 'rb-' + this._form.nextId(); } this.labelId = 'lbl-' + this.id; + + let checked = this.checked; + if (typeof checked === 'string') { + this.checked = (checked === '' || checked === 'true'); + } + this.isChecked = this.checked; + this._renderer.setElementAttribute(this._elementRef, 'checked', null); } /** @@ -72,7 +81,7 @@ export class RadioButton { @HostListener('click', ['$event']) private onClick(ev) { console.debug('RadioButton, select', this.value); - this.select.emit(ev, this.value); + this.select.emit(this); } public set isChecked(isChecked) { @@ -135,15 +144,16 @@ export class RadioButton { } }) export class RadioGroup { - @Output() change: EventEmitter = new EventEmitter(); + @Output() change: EventEmitter = new EventEmitter(); @ContentChildren(RadioButton) private _buttons; @ContentChild(ListHeader) private _header; - constructor(@Optional() ngControl: NgControl, private _renderer: Renderer, private _elementRef: ElementRef) { + id: any; + value: any; + + constructor(@Optional() private ngControl: NgControl, private _renderer: Renderer, private _elementRef: ElementRef) { this.ngControl = ngControl; this.id = ++radioGroupIds; - this.onChange = (_) => {}; - this.onTouched = (_) => {}; if (ngControl) { this.ngControl.valueAccessor = this; @@ -156,7 +166,7 @@ export class RadioGroup { * the checked value. * https://github.com/angular/angular/blob/master/modules/angular2/src/forms/directives/shared.ts#L34 */ - writeValue(value) { + public writeValue(value) { this.value = isDefined(value) ? value : ''; if (this._buttons) { let buttons = this._buttons.toArray(); @@ -170,6 +180,26 @@ export class RadioGroup { } } + public onChange = (_:any) => {}; + public onTouched = () => {}; + + /** + * @private + * Angular2 Forms API method called by the view (NgControl) to register the + * onChange event handler that updates the model (Control). + * https://github.com/angular/angular/blob/master/modules/angular2/src/forms/directives/shared.ts#L27 + * @param {Function} fn the onChange event handler. + */ + public registerOnChange(fn) { this.onChange = fn; } + + /** + * @private + * Angular2 Forms API method called by the the view (NgControl) to register + * the onTouched event handler that marks the model (Control) as touched. + * @param {Function} fn onTouched event handler. + */ + public registerOnTouched(fn) { this.onTouched = fn; } + /** * @private */ @@ -187,35 +217,21 @@ export class RadioGroup { button.select.subscribe(() => { this.writeValue(button.value); this.onChange(button.value); - this.change.emit(this.value); + this.change.emit(this); }); if (isDefined(this.value)) { let isChecked = (button.value === this.value) || button.checked; button.isChecked = isChecked; if (isChecked) { + this.writeValue(button.value); + this.onChange(button.value); this._renderer.setElementAttribute(this._elementRef, 'aria-activedescendant', button.id); } } } } - /** - * @private - * Angular2 Forms API method called by the view (NgControl) to register the - * onChange event handler that updates the model (Control). - * https://github.com/angular/angular/blob/master/modules/angular2/src/forms/directives/shared.ts#L27 - * @param {Function} fn the onChange event handler. - */ - registerOnChange(fn) { this.onChange = fn; } - - /** - * @private - * Angular2 Forms API method called by the the view (NgControl) to register - * the onTouched event handler that marks the model (Control) as touched. - * @param {Function} fn onTouched event handler. - */ - registerOnTouched(fn) { this.onTouched = fn; } } let radioGroupIds = -1; diff --git a/ionic/components/radio/test/basic/main.html b/ionic/components/radio/test/basic/main.html index 0ec2435ad8..f727972ee6 100644 --- a/ionic/components/radio/test/basic/main.html +++ b/ionic/components/radio/test/basic/main.html @@ -65,4 +65,14 @@ relationship: {{relationship}} + + Dogs + Cats + Turtles + + +
+ pet: {{pet}} +
+ diff --git a/ionic/components/searchbar/searchbar.ts b/ionic/components/searchbar/searchbar.ts index a696d0b689..e61aa1a6a0 100644 --- a/ionic/components/searchbar/searchbar.ts +++ b/ionic/components/searchbar/searchbar.ts @@ -25,8 +25,8 @@ export class SearchbarInput { event.stopPropagation(); } - constructor(elementRef: ElementRef) { - this.elementRef = elementRef; + constructor(public elementRef: ElementRef) { + } } @@ -114,12 +114,14 @@ export class Searchbar extends Ion { value: string = ''; blurInput: boolean = true; + inputElement: any; + searchIconElement: any; @HostBinding('class.searchbar-focused') isFocused; @HostBinding('class.searchbar-left-aligned') shouldLeftAlign; constructor( - elementRef: ElementRef, + public elementRef: ElementRef, config: Config, @Optional() ngControl: NgControl ) {