diff --git a/modules/angular2/src/forms/directives/checkbox_value_accessor.ts b/modules/angular2/src/forms/directives/checkbox_value_accessor.ts index 2479af5d7d..624ae6f596 100644 --- a/modules/angular2/src/forms/directives/checkbox_value_accessor.ts +++ b/modules/angular2/src/forms/directives/checkbox_value_accessor.ts @@ -30,12 +30,10 @@ import {setProperty} from './shared'; }) export class CheckboxControlValueAccessor implements ControlValueAccessor { checked: boolean; - onChange: Function; - onTouched: Function; + onChange = (_) => {}; + onTouched = () => {}; constructor(private cd: NgControl, private renderer: Renderer, private elementRef: ElementRef) { - this.onChange = (_) => {}; - this.onTouched = (_) => {}; cd.valueAccessor = this; } diff --git a/modules/angular2/src/forms/directives/default_value_accessor.ts b/modules/angular2/src/forms/directives/default_value_accessor.ts index da92c9ab25..04483805b3 100644 --- a/modules/angular2/src/forms/directives/default_value_accessor.ts +++ b/modules/angular2/src/forms/directives/default_value_accessor.ts @@ -33,12 +33,10 @@ import {setProperty} from './shared'; }) export class DefaultValueAccessor implements ControlValueAccessor { value: string = null; - onChange: Function; - onTouched: Function; + onChange = (_) => {}; + onTouched = () => {}; constructor(private cd: NgControl, private renderer: Renderer, private elementRef: ElementRef) { - this.onChange = (_) => {}; - this.onTouched = (_) => {}; cd.valueAccessor = this; } diff --git a/modules/angular2/src/forms/directives/ng_control_name.ts b/modules/angular2/src/forms/directives/ng_control_name.ts index 62eb55672b..a7448328c8 100644 --- a/modules/angular2/src/forms/directives/ng_control_name.ts +++ b/modules/angular2/src/forms/directives/ng_control_name.ts @@ -75,25 +75,23 @@ const controlNameBinding = @Directive({ selector: '[ng-control]', hostInjector: [controlNameBinding], - properties: ['name: ng-control', 'model: ng-model'], - events: ['ngModel'], + properties: ['name: ngControl', 'model: ngModel'], + events: ['update: ngModel'], lifecycle: [onDestroy, onChange], exportAs: 'form' }) export class NgControlName extends NgControl { _parent: ControlContainer; - ngModel: EventEmitter; + update = new EventEmitter(); model: any; ngValidators: QueryList; - _added: boolean; + _added = false; // Scope the query once https://github.com/angular/angular/issues/2603 is fixed constructor(@Ancestor() parent: ControlContainer, @Query(NgValidator) ngValidators: QueryList) { super(); this._parent = parent; - this.ngModel = new EventEmitter(); - this._added = false; this.ngValidators = ngValidators; } @@ -109,7 +107,7 @@ export class NgControlName extends NgControl { onDestroy() { this.formDirective.removeControl(this); } - viewToModelUpdate(newValue: any): void { ObservableWrapper.callNext(this.ngModel, newValue); } + viewToModelUpdate(newValue: any): void { ObservableWrapper.callNext(this.update, newValue); } get path(): List { return controlPath(this.name, this._parent); } diff --git a/modules/angular2/src/forms/directives/ng_form_control.ts b/modules/angular2/src/forms/directives/ng_form_control.ts index afc8b76171..918c50a31f 100644 --- a/modules/angular2/src/forms/directives/ng_form_control.ts +++ b/modules/angular2/src/forms/directives/ng_form_control.ts @@ -63,23 +63,21 @@ const formControlBinding = @Directive({ selector: '[ng-form-control]', hostInjector: [formControlBinding], - properties: ['form: ng-form-control', 'model: ng-model'], - events: ['ngModel'], + properties: ['form: ngFormControl', 'model: ngModel'], + events: ['update: ngModel'], lifecycle: [onChange], exportAs: 'form' }) export class NgFormControl extends NgControl { form: Control; - ngModel: EventEmitter; - _added: boolean; + update = new EventEmitter(); + _added = false; model: any; ngValidators: QueryList; // Scope the query once https://github.com/angular/angular/issues/2603 is fixed constructor(@Query(NgValidator) ngValidators: QueryList) { super(); - this.ngModel = new EventEmitter(); - this._added = false; this.ngValidators = ngValidators; } @@ -100,5 +98,5 @@ export class NgFormControl extends NgControl { get validator(): Function { return composeNgValidator(this.ngValidators); } - viewToModelUpdate(newValue: any): void { ObservableWrapper.callNext(this.ngModel, newValue); } + viewToModelUpdate(newValue: any): void { ObservableWrapper.callNext(this.update, newValue); } } diff --git a/modules/angular2/src/forms/directives/ng_form_model.ts b/modules/angular2/src/forms/directives/ng_form_model.ts index cf0213258a..3e85423212 100644 --- a/modules/angular2/src/forms/directives/ng_form_model.ts +++ b/modules/angular2/src/forms/directives/ng_form_model.ts @@ -95,14 +95,9 @@ const formDirectiveBinding = }) export class NgFormModel extends ControlContainer implements Form { form: ControlGroup = null; - directives: List; + directives: List = []; ngSubmit = new EventEmitter(); - constructor() { - super(); - this.directives = []; - } - onChange(_) { this._updateDomValue(); } get formDirective(): Form { return this; } diff --git a/modules/angular2/src/forms/directives/ng_model.ts b/modules/angular2/src/forms/directives/ng_model.ts index 75dbf02650..271aff9cb0 100644 --- a/modules/angular2/src/forms/directives/ng_model.ts +++ b/modules/angular2/src/forms/directives/ng_model.ts @@ -33,15 +33,15 @@ const formControlBinding = CONST_EXPR(new Binding(NgControl, {toAlias: forwardRe @Directive({ selector: '[ng-model]:not([ng-control]):not([ng-form-control])', hostInjector: [formControlBinding], - properties: ['model: ng-model'], - events: ['ngModel'], + properties: ['model: ngModel'], + events: ['update: ngModel'], lifecycle: [onChange], exportAs: 'form' }) export class NgModel extends NgControl { _control = new Control(""); _added = false; - ngModel = new EventEmitter(); + update = new EventEmitter(); model: any; ngValidators: QueryList; @@ -69,5 +69,5 @@ export class NgModel extends NgControl { get validator(): Function { return composeNgValidator(this.ngValidators); } - viewToModelUpdate(newValue: any): void { ObservableWrapper.callNext(this.ngModel, newValue); } + viewToModelUpdate(newValue: any): void { ObservableWrapper.callNext(this.update, newValue); } } 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 b18563c495..a8e1072cc2 100644 --- a/modules/angular2/src/forms/directives/select_control_value_accessor.ts +++ b/modules/angular2/src/forms/directives/select_control_value_accessor.ts @@ -40,13 +40,11 @@ export class NgSelectOption { }) export class SelectControlValueAccessor implements ControlValueAccessor { value = ''; - onChange: Function; - onTouched: Function; + onChange = (_) => {}; + onTouched = () => {}; constructor(private cd: NgControl, private renderer: Renderer, private elementRef: ElementRef, @Query(NgSelectOption, {descendants: true}) query: QueryList) { - this.onChange = (_) => {}; - this.onTouched = (_) => {}; cd.valueAccessor = this; this._updateValueWhenListOfOptionsChanges(query); diff --git a/modules/examples/src/template_driven_forms/index.ts b/modules/examples/src/template_driven_forms/index.ts index 1345e0141b..ca79f0a923 100644 --- a/modules/examples/src/template_driven_forms/index.ts +++ b/modules/examples/src/template_driven_forms/index.ts @@ -35,9 +35,7 @@ class CheckoutModel { */ @Directive({selector: '[credit-card]'}) class CreditCardValidator { - constructor(c: NgControl) { - c.validator = Validators.compose([c.validator, CreditCardValidator.validate]); - } + get validator() { return CreditCardValidator.validate; } static validate(c): StringMap { if (isPresent(c.value) && RegExpWrapper.test(new RegExp("^\\d{16}$"), c.value)) {