diff --git a/modules/angular2/src/forms/directives.ts b/modules/angular2/src/forms/directives.ts index 83fc92d0e6..5bd1ad0499 100644 --- a/modules/angular2/src/forms/directives.ts +++ b/modules/angular2/src/forms/directives.ts @@ -7,7 +7,10 @@ import {NgFormModel} from './directives/ng_form_model'; import {NgForm} from './directives/ng_form'; import {DefaultValueAccessor} from './directives/default_value_accessor'; import {CheckboxControlValueAccessor} from './directives/checkbox_value_accessor'; -import {SelectControlValueAccessor} from './directives/select_control_value_accessor'; +import { + SelectControlValueAccessor, + NgSelectOption +} from './directives/select_control_value_accessor'; import {NgRequiredValidator} from './directives/validators'; export {NgControlName} from './directives/ng_control_name'; @@ -40,6 +43,7 @@ export const formDirectives: List = CONST_EXPR([ NgFormModel, NgForm, + NgSelectOption, DefaultValueAccessor, CheckboxControlValueAccessor, SelectControlValueAccessor, diff --git a/modules/angular2/src/forms/directives/checkbox_value_accessor.ts b/modules/angular2/src/forms/directives/checkbox_value_accessor.ts index b4c8cb1b6b..2479af5d7d 100644 --- a/modules/angular2/src/forms/directives/checkbox_value_accessor.ts +++ b/modules/angular2/src/forms/directives/checkbox_value_accessor.ts @@ -1,6 +1,7 @@ -import {Directive} from 'angular2/angular2'; +import {Directive, Renderer, ElementRef} from 'angular2/angular2'; import {NgControl} from './ng_control'; import {ControlValueAccessor} from './control_value_accessor'; +import {setProperty} from './shared'; /** * The accessor for writing a value and listening to changes on a checkbox input element. @@ -32,13 +33,18 @@ export class CheckboxControlValueAccessor implements ControlValueAccessor { onChange: Function; onTouched: Function; - constructor(private cd: NgControl) { + constructor(private cd: NgControl, private renderer: Renderer, private elementRef: ElementRef) { this.onChange = (_) => {}; this.onTouched = (_) => {}; cd.valueAccessor = this; } - writeValue(value) { this.checked = value; } + writeValue(value) { + // both this.checked and setProperty are required at the moment + // remove when a proper imperative API is provided + this.checked = value; + setProperty(this.renderer, this.elementRef, "checked", value); + } registerOnChange(fn): void { this.onChange = fn; } registerOnTouched(fn): void { this.onTouched = fn; } diff --git a/modules/angular2/src/forms/directives/default_value_accessor.ts b/modules/angular2/src/forms/directives/default_value_accessor.ts index cf1169fa58..da92c9ab25 100644 --- a/modules/angular2/src/forms/directives/default_value_accessor.ts +++ b/modules/angular2/src/forms/directives/default_value_accessor.ts @@ -1,7 +1,8 @@ -import {Directive} from 'angular2/angular2'; +import {Directive, Renderer, ElementRef} from 'angular2/angular2'; import {NgControl} from './ng_control'; import {ControlValueAccessor} from './control_value_accessor'; import {isBlank} from 'angular2/src/facade/lang'; +import {setProperty} from './shared'; /** * The default accessor for writing a value and listening to changes that is used by the @@ -35,13 +36,18 @@ export class DefaultValueAccessor implements ControlValueAccessor { onChange: Function; onTouched: Function; - constructor(private cd: NgControl) { + constructor(private cd: NgControl, private renderer: Renderer, private elementRef: ElementRef) { this.onChange = (_) => {}; this.onTouched = (_) => {}; cd.valueAccessor = this; } - writeValue(value) { this.value = isBlank(value) ? "" : value; } + writeValue(value) { + // both this.value and setProperty are required at the moment + // remove when a proper imperative API is provided + this.value = isBlank(value) ? '' : value; + setProperty(this.renderer, this.elementRef, 'value', this.value); + } registerOnChange(fn): void { this.onChange = fn; } diff --git a/modules/angular2/src/forms/directives/select_control_value_accessor.ts b/modules/angular2/src/forms/directives/select_control_value_accessor.ts index c0f48c58ba..b18563c495 100644 --- a/modules/angular2/src/forms/directives/select_control_value_accessor.ts +++ b/modules/angular2/src/forms/directives/select_control_value_accessor.ts @@ -1,6 +1,22 @@ -import {Directive} from 'angular2/angular2'; +import {Directive, Query, QueryList, Renderer, ElementRef} from 'angular2/angular2'; import {NgControl} from './ng_control'; import {ControlValueAccessor} from './control_value_accessor'; +import {setProperty} from './shared'; + +/** + * Marks