diff --git a/modules/angular2/angular2.api.ts b/modules/angular2/angular2.api.ts index 41e9c6dcd3..3b0821275b 100644 --- a/modules/angular2/angular2.api.ts +++ b/modules/angular2/angular2.api.ts @@ -18,8 +18,8 @@ export * from './src/core/compiler/element_injector'; // We export the Directive *annotation* instead of the *decorator*. // But it breaks the build. export {Directive, LifecycleEvent} from './src/core/annotations_impl/annotations'; -export {FormDirective} from './src/forms/directives/form_directive'; -export {ControlContainerDirective} from './src/forms/directives/control_container_directive'; +export {Form} from './src/forms/directives/form_interface'; +export {ControlContainer} from './src/forms/directives/control_container'; export {Injectable} from './src/di/annotations_impl'; export {BaseQueryList} from './src/core/compiler/base_query_list'; export {AppProtoView, AppView, AppViewContainer} from './src/core/compiler/view'; diff --git a/modules/angular2/forms.ts b/modules/angular2/forms.ts index 3094c73d24..bd59db924e 100644 --- a/modules/angular2/forms.ts +++ b/modules/angular2/forms.ts @@ -16,7 +16,7 @@ export * from './src/forms/model'; export * from './src/forms/directives'; export * from './src/forms/validators'; -export * from './src/forms/validator_directives'; +export * from './src/forms/directives/validators'; export * from './src/forms/form_builder'; import {FormBuilder} from './src/forms/form_builder'; diff --git a/modules/angular2/src/forms/directives.ts b/modules/angular2/src/forms/directives.ts index 4c4fafeb95..83fc92d0e6 100644 --- a/modules/angular2/src/forms/directives.ts +++ b/modules/angular2/src/forms/directives.ts @@ -1,27 +1,27 @@ import {Type, CONST_EXPR} from 'angular2/src/facade/lang'; -import {ControlNameDirective} from './directives/control_name_directive'; -import {FormControlDirective} from './directives/form_control_directive'; -import {NgModelDirective} from './directives/ng_model_directive'; -import {ControlGroupDirective} from './directives/control_group_directive'; -import {FormModelDirective} from './directives/form_model_directive'; -import {TemplateDrivenFormDirective} from './directives/template_driven_form_directive'; +import {NgControlName} from './directives/ng_control_name'; +import {NgFormControl} from './directives/ng_form_control'; +import {NgModel} from './directives/ng_model'; +import {NgControlGroup} from './directives/ng_control_group'; +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 {RequiredValidatorDirective} from './validator_directives'; +import {NgRequiredValidator} from './directives/validators'; -export {ControlNameDirective} from './directives/control_name_directive'; -export {FormControlDirective} from './directives/form_control_directive'; -export {NgModelDirective} from './directives/ng_model_directive'; -export {ControlDirective} from './directives/control_directive'; -export {ControlGroupDirective} from './directives/control_group_directive'; -export {FormModelDirective} from './directives/form_model_directive'; -export {TemplateDrivenFormDirective} from './directives/template_driven_form_directive'; +export {NgControlName} from './directives/ng_control_name'; +export {NgFormControl} from './directives/ng_form_control'; +export {NgModel} from './directives/ng_model'; +export {NgControl} from './directives/ng_control'; +export {NgControlGroup} from './directives/ng_control_group'; +export {NgFormModel} from './directives/ng_form_model'; +export {NgForm} from './directives/ng_form'; export {ControlValueAccessor} from './directives/control_value_accessor'; export {DefaultValueAccessor} from './directives/default_value_accessor'; export {CheckboxControlValueAccessor} from './directives/checkbox_value_accessor'; export {SelectControlValueAccessor} from './directives/select_control_value_accessor'; -export {RequiredValidatorDirective} from './validator_directives'; +export {NgRequiredValidator} from './directives/validators'; /** * @@ -32,17 +32,17 @@ export {RequiredValidatorDirective} from './validator_directives'; * @exportedAs angular2/forms */ export const formDirectives: List = CONST_EXPR([ - ControlNameDirective, - ControlGroupDirective, + NgControlName, + NgControlGroup, - FormControlDirective, - NgModelDirective, - FormModelDirective, - TemplateDrivenFormDirective, + NgFormControl, + NgModel, + NgFormModel, + NgForm, DefaultValueAccessor, CheckboxControlValueAccessor, SelectControlValueAccessor, - RequiredValidatorDirective + NgRequiredValidator ]); \ No newline at end of file diff --git a/modules/angular2/src/forms/directives/checkbox_value_accessor.ts b/modules/angular2/src/forms/directives/checkbox_value_accessor.ts index eae241828b..3f7a4287ee 100644 --- a/modules/angular2/src/forms/directives/checkbox_value_accessor.ts +++ b/modules/angular2/src/forms/directives/checkbox_value_accessor.ts @@ -1,5 +1,5 @@ import {Directive} from 'angular2/angular2'; -import {ControlDirective} from './control_directive'; +import {NgControl} from './ng_control'; import {ControlValueAccessor} from './control_value_accessor'; /** @@ -33,7 +33,7 @@ export class CheckboxControlValueAccessor implements ControlValueAccessor { onChange: Function; onTouched: Function; - constructor(private cd: ControlDirective) { + constructor(private cd: NgControl) { this.onChange = (_) => {}; this.onTouched = (_) => {}; cd.valueAccessor = this; diff --git a/modules/angular2/src/forms/directives/control_container.ts b/modules/angular2/src/forms/directives/control_container.ts new file mode 100644 index 0000000000..23f7fbf059 --- /dev/null +++ b/modules/angular2/src/forms/directives/control_container.ts @@ -0,0 +1,13 @@ +import {Form} from './form_interface'; +import {List} from 'angular2/src/facade/collection'; + +/** + * A directive that contains a group of [NgControl]. + * + * @exportedAs angular2/forms + */ +export class ControlContainer { + name: string; + get formDirective(): Form { return null; } + get path(): List { return null; } +} diff --git a/modules/angular2/src/forms/directives/control_container_directive.ts b/modules/angular2/src/forms/directives/control_container_directive.ts deleted file mode 100644 index c4e062a185..0000000000 --- a/modules/angular2/src/forms/directives/control_container_directive.ts +++ /dev/null @@ -1,13 +0,0 @@ -import {FormDirective} from './form_directive'; -import {List} from 'angular2/src/facade/collection'; - -/** - * A directive that contains a group of [ControlDirective]. - * - * @exportedAs angular2/forms - */ -export class ControlContainerDirective { - name: string; - get formDirective(): FormDirective { return null; } - get path(): List { return null; } -} diff --git a/modules/angular2/src/forms/directives/default_value_accessor.ts b/modules/angular2/src/forms/directives/default_value_accessor.ts index d940902323..3cde8304e2 100644 --- a/modules/angular2/src/forms/directives/default_value_accessor.ts +++ b/modules/angular2/src/forms/directives/default_value_accessor.ts @@ -1,5 +1,5 @@ import {Directive} from 'angular2/angular2'; -import {ControlDirective} from './control_directive'; +import {NgControl} from './ng_control'; import {ControlValueAccessor} from './control_value_accessor'; import {isBlank} from 'angular2/src/facade/lang'; @@ -37,7 +37,7 @@ export class DefaultValueAccessor implements ControlValueAccessor { onChange: Function; onTouched: Function; - constructor(private cd: ControlDirective) { + constructor(private cd: NgControl) { this.onChange = (_) => {}; this.onTouched = (_) => {}; cd.valueAccessor = this; diff --git a/modules/angular2/src/forms/directives/form_directive.ts b/modules/angular2/src/forms/directives/form_directive.ts deleted file mode 100644 index bb7d9e8596..0000000000 --- a/modules/angular2/src/forms/directives/form_directive.ts +++ /dev/null @@ -1,12 +0,0 @@ -import {ControlDirective} from './control_directive'; -import {ControlGroupDirective} from './control_group_directive'; -import {Control} from '../model'; - -export interface FormDirective { - addControl(dir: ControlDirective): void; - removeControl(dir: ControlDirective): void; - getControl(dir: ControlDirective): Control; - addControlGroup(dir: ControlGroupDirective): void; - removeControlGroup(dir: ControlGroupDirective): void; - updateModel(dir: ControlDirective, value: any): void; -} \ No newline at end of file diff --git a/modules/angular2/src/forms/directives/form_interface.ts b/modules/angular2/src/forms/directives/form_interface.ts new file mode 100644 index 0000000000..d2aadcd3f0 --- /dev/null +++ b/modules/angular2/src/forms/directives/form_interface.ts @@ -0,0 +1,12 @@ +import {NgControl} from './ng_control'; +import {NgControlGroup} from './ng_control_group'; +import {Control} from '../model'; + +export interface Form { + addControl(dir: NgControl): void; + removeControl(dir: NgControl): void; + getControl(dir: NgControl): Control; + addControlGroup(dir: NgControlGroup): void; + removeControlGroup(dir: NgControlGroup): void; + updateModel(dir: NgControl, value: any): void; +} \ No newline at end of file diff --git a/modules/angular2/src/forms/directives/control_directive.ts b/modules/angular2/src/forms/directives/ng_control.ts similarity index 94% rename from modules/angular2/src/forms/directives/control_directive.ts rename to modules/angular2/src/forms/directives/ng_control.ts index 97ba180711..46a0f5ccd4 100644 --- a/modules/angular2/src/forms/directives/control_directive.ts +++ b/modules/angular2/src/forms/directives/ng_control.ts @@ -7,7 +7,7 @@ import {Control} from '../model'; * * @exportedAs angular2/forms */ -export class ControlDirective { +export class NgControl { name: string = null; valueAccessor: ControlValueAccessor = null; validator: Function; diff --git a/modules/angular2/src/forms/directives/control_group_directive.ts b/modules/angular2/src/forms/directives/ng_control_group.ts similarity index 80% rename from modules/angular2/src/forms/directives/control_group_directive.ts rename to modules/angular2/src/forms/directives/ng_control_group.ts index 0cdd2c1c0f..0fcb4c76a2 100644 --- a/modules/angular2/src/forms/directives/control_group_directive.ts +++ b/modules/angular2/src/forms/directives/ng_control_group.ts @@ -3,11 +3,11 @@ import {Inject, FORWARD_REF, Binding} from 'angular2/di'; import {List, ListWrapper} from 'angular2/src/facade/collection'; import {CONST_EXPR} from 'angular2/src/facade/lang'; -import {ControlContainerDirective} from './control_container_directive'; +import {ControlContainer} from './control_container'; import {controlPath} from './shared'; -const controlGroupBinding = CONST_EXPR( - new Binding(ControlContainerDirective, {toAlias: FORWARD_REF(() => ControlGroupDirective)})); +const controlGroupBinding = + CONST_EXPR(new Binding(ControlContainer, {toAlias: FORWARD_REF(() => NgControlGroup)})); /** * Binds a ng-control group to a DOM element. @@ -18,7 +18,7 @@ const controlGroupBinding = CONST_EXPR( * password controls to the login and password elements. * * Here we use {@link formDirectives}, rather than importing each form directive individually, e.g. - * `ControlDirective`, `ControlGroupDirective`. This is just a shorthand for the same end result. + * `NgControl`, `ControlGroupDirective`. This is just a shorthand for the same end result. * * ``` * @Component({selector: "login-comp"}) @@ -61,9 +61,9 @@ const controlGroupBinding = CONST_EXPR( lifecycle: [onInit, onDestroy], exportAs: 'form' }) -export class ControlGroupDirective extends ControlContainerDirective { - _parent: ControlContainerDirective; - constructor(@Ancestor() _parent: ControlContainerDirective) { +export class NgControlGroup extends ControlContainer { + _parent: ControlContainer; + constructor(@Ancestor() _parent: ControlContainer) { super(); this._parent = _parent; } diff --git a/modules/angular2/src/forms/directives/control_name_directive.ts b/modules/angular2/src/forms/directives/ng_control_name.ts similarity index 83% rename from modules/angular2/src/forms/directives/control_name_directive.ts rename to modules/angular2/src/forms/directives/ng_control_name.ts index 294dd7be7c..f3cd699e65 100644 --- a/modules/angular2/src/forms/directives/control_name_directive.ts +++ b/modules/angular2/src/forms/directives/ng_control_name.ts @@ -4,13 +4,13 @@ import {List, StringMapWrapper, StringMap} from 'angular2/src/facade/collection' import {Directive, Ancestor, onDestroy, onChange} from 'angular2/angular2'; import {FORWARD_REF, Binding, Inject} from 'angular2/di'; -import {ControlContainerDirective} from './control_container_directive'; -import {ControlDirective} from './control_directive'; +import {ControlContainer} from './control_container'; +import {NgControl} from './ng_control'; import {controlPath} from './shared'; import {Control} from '../model'; const controlNameBinding = - CONST_EXPR(new Binding(ControlDirective, {toAlias: FORWARD_REF(() => ControlNameDirective)})); + CONST_EXPR(new Binding(NgControl, {toAlias: FORWARD_REF(() => NgControlName)})); /** * Binds a control with the specified name to a DOM element. @@ -25,7 +25,7 @@ const controlNameBinding = * change. * * Here we use {@link formDirectives}, rather than importing each form directive individually, e.g. - * `ControlDirective`, `ControlGroupDirective`. This is just a shorthand for the same end result. + * `NgControl`, `ControlGroupDirective`. This is just a shorthand for the same end result. * * ``` * @Component({selector: "login-comp"}) @@ -63,13 +63,13 @@ const controlNameBinding = lifecycle: [onDestroy, onChange], exportAs: 'form' }) -export class ControlNameDirective extends ControlDirective { - _parent: ControlContainerDirective; +export class NgControlName extends NgControl { + _parent: ControlContainer; ngModel: EventEmitter; model: any; _added: boolean; - constructor(@Ancestor() _parent: ControlContainerDirective) { + constructor(@Ancestor() _parent: ControlContainer) { super(); this._parent = _parent; this.ngModel = new EventEmitter(); diff --git a/modules/angular2/src/forms/directives/template_driven_form_directive.ts b/modules/angular2/src/forms/directives/ng_form.ts similarity index 72% rename from modules/angular2/src/forms/directives/template_driven_form_directive.ts rename to modules/angular2/src/forms/directives/ng_form.ts index de8bd0816c..2f208a43c4 100644 --- a/modules/angular2/src/forms/directives/template_driven_form_directive.ts +++ b/modules/angular2/src/forms/directives/ng_form.ts @@ -3,15 +3,15 @@ import {StringMapWrapper, List, ListWrapper} from 'angular2/src/facade/collectio import {isPresent, isBlank, CONST_EXPR} from 'angular2/src/facade/lang'; import {Directive} from 'angular2/src/core/annotations/decorators'; import {FORWARD_REF, Binding} from 'angular2/di'; -import {ControlDirective} from './control_directive'; -import {FormDirective} from './form_directive'; -import {ControlGroupDirective} from './control_group_directive'; -import {ControlContainerDirective} from './control_container_directive'; +import {NgControl} from './ng_control'; +import {Form} from './form_interface'; +import {NgControlGroup} from './ng_control_group'; +import {ControlContainer} from './control_container'; import {AbstractControl, ControlGroup, Control} from '../model'; import {setUpControl} from './shared'; -const formDirectiveBinding = CONST_EXPR(new Binding( - ControlContainerDirective, {toAlias: FORWARD_REF(() => TemplateDrivenFormDirective)})); +const formDirectiveBinding = + CONST_EXPR(new Binding(ControlContainer, {toAlias: FORWARD_REF(() => NgForm)})); @Directive({ selector: 'form:not([ng-no-form]):not([ng-form-model]),ng-form,[ng-form]', @@ -22,8 +22,7 @@ const formDirectiveBinding = CONST_EXPR(new Binding( events: ['ngSubmit'], exportAs: 'form' }) -export class TemplateDrivenFormDirective extends ControlContainerDirective implements - FormDirective { +export class NgForm extends ControlContainer implements Form { form: ControlGroup; ngSubmit = new EventEmitter(); @@ -32,7 +31,7 @@ export class TemplateDrivenFormDirective extends ControlContainerDirective imple this.form = new ControlGroup({}); } - get formDirective(): FormDirective { return this; } + get formDirective(): Form { return this; } get path(): List { return []; } @@ -42,7 +41,7 @@ export class TemplateDrivenFormDirective extends ControlContainerDirective imple get errors(): any { return this.form.errors; } - addControl(dir: ControlDirective): void { + addControl(dir: NgControl): void { this._later(_ => { var container = this._findContainer(dir.path); var c = new Control(""); @@ -52,9 +51,9 @@ export class TemplateDrivenFormDirective extends ControlContainerDirective imple }); } - getControl(dir: ControlDirective): Control { return this.form.find(dir.path); } + getControl(dir: NgControl): Control { return this.form.find(dir.path); } - removeControl(dir: ControlDirective): void { + removeControl(dir: NgControl): void { this._later(_ => { var container = this._findContainer(dir.path); if (isPresent(container)) { @@ -64,7 +63,7 @@ export class TemplateDrivenFormDirective extends ControlContainerDirective imple }); } - addControlGroup(dir: ControlGroupDirective): void { + addControlGroup(dir: NgControlGroup): void { this._later(_ => { var container = this._findContainer(dir.path); var c = new ControlGroup({}); @@ -73,7 +72,7 @@ export class TemplateDrivenFormDirective extends ControlContainerDirective imple }); } - removeControlGroup(dir: ControlGroupDirective): void { + removeControlGroup(dir: NgControlGroup): void { this._later(_ => { var container = this._findContainer(dir.path); if (isPresent(container)) { @@ -83,7 +82,7 @@ export class TemplateDrivenFormDirective extends ControlContainerDirective imple }); } - updateModel(dir: ControlDirective, value: any): void { + updateModel(dir: NgControl, value: any): void { this._later(_ => { var c = this.form.find(dir.path); c.updateValue(value); diff --git a/modules/angular2/src/forms/directives/form_control_directive.ts b/modules/angular2/src/forms/directives/ng_form_control.ts similarity index 86% rename from modules/angular2/src/forms/directives/form_control_directive.ts rename to modules/angular2/src/forms/directives/ng_form_control.ts index 1ada92e2cb..965d81a0a9 100644 --- a/modules/angular2/src/forms/directives/form_control_directive.ts +++ b/modules/angular2/src/forms/directives/ng_form_control.ts @@ -5,12 +5,12 @@ import {EventEmitter, ObservableWrapper} from 'angular2/src/facade/async'; import {Directive, Ancestor, onChange} from 'angular2/angular2'; import {FORWARD_REF, Binding} from 'angular2/di'; -import {ControlDirective} from './control_directive'; +import {NgControl} from './ng_control'; import {Control} from '../model'; import {setUpControl} from './shared'; const formControlBinding = - CONST_EXPR(new Binding(ControlDirective, {toAlias: FORWARD_REF(() => FormControlDirective)})); + CONST_EXPR(new Binding(NgControl, {toAlias: FORWARD_REF(() => NgFormControl)})); /** * Binds a control to a DOM element. @@ -24,7 +24,7 @@ const formControlBinding = * change. * * Here we use {@link formDirectives}, rather than importing each form directive individually, e.g. - * `ControlDirective`, `ControlGroupDirective`. This is just a shorthand for the same end result. + * `NgControl`, `ControlGroupDirective`. This is just a shorthand for the same end result. * * ``` * @Component({selector: "login-comp"}) @@ -52,7 +52,7 @@ const formControlBinding = lifecycle: [onChange], exportAs: 'form' }) -export class FormControlDirective extends ControlDirective { +export class NgFormControl extends NgControl { form: Control; ngModel: EventEmitter; _added: boolean; diff --git a/modules/angular2/src/forms/directives/form_model_directive.ts b/modules/angular2/src/forms/directives/ng_form_model.ts similarity index 69% rename from modules/angular2/src/forms/directives/form_model_directive.ts rename to modules/angular2/src/forms/directives/ng_form_model.ts index 512a95e4bd..8ab7596213 100644 --- a/modules/angular2/src/forms/directives/form_model_directive.ts +++ b/modules/angular2/src/forms/directives/ng_form_model.ts @@ -4,15 +4,15 @@ import {ObservableWrapper, EventEmitter} from 'angular2/src/facade/async'; import {Directive, onChange} from 'angular2/angular2'; import {FORWARD_REF, Binding} from 'angular2/di'; -import {ControlDirective} from './control_directive'; -import {ControlGroupDirective} from './control_group_directive'; -import {ControlContainerDirective} from './control_container_directive'; -import {FormDirective} from './form_directive'; +import {NgControl} from './ng_control'; +import {NgControlGroup} from './ng_control_group'; +import {ControlContainer} from './control_container'; +import {Form} from './form_interface'; import {Control, ControlGroup} from '../model'; import {setUpControl} from './shared'; -const formDirectiveBinding = CONST_EXPR( - new Binding(ControlContainerDirective, {toAlias: FORWARD_REF(() => FormModelDirective)})); +const formDirectiveBinding = + CONST_EXPR(new Binding(ControlContainer, {toAlias: FORWARD_REF(() => NgFormModel)})); /** * Binds a control group to a DOM element. @@ -24,7 +24,7 @@ const formDirectiveBinding = CONST_EXPR( * login and password elements. * * Here we use {@link formDirectives}, rather than importing each form directive individually, e.g. - * `ControlDirective`, `ControlGroupDirective`. This is just a shorthand for the same end result. + * `NgControl`, `NgControlGroup`. This is just a shorthand for the same end result. * * ``` * @Component({selector: "login-comp"}) @@ -66,9 +66,9 @@ const formDirectiveBinding = CONST_EXPR( events: ['ngSubmit'], exportAs: 'form' }) -export class FormModelDirective extends ControlContainerDirective implements FormDirective { +export class NgFormModel extends ControlContainer implements Form { form: ControlGroup = null; - directives: List; + directives: List; ngSubmit = new EventEmitter(); constructor() { @@ -78,26 +78,26 @@ export class FormModelDirective extends ControlContainerDirective implements For onChange(_) { this._updateDomValue(); } - get formDirective(): FormDirective { return this; } + get formDirective(): Form { return this; } get path(): List { return []; } - addControl(dir: ControlDirective): void { + addControl(dir: NgControl): void { var c: any = this.form.find(dir.path); setUpControl(c, dir); c.updateValidity(); ListWrapper.push(this.directives, dir); } - getControl(dir: ControlDirective): Control { return this.form.find(dir.path); } + getControl(dir: NgControl): Control { return this.form.find(dir.path); } - removeControl(dir: ControlDirective): void { ListWrapper.remove(this.directives, dir); } + removeControl(dir: NgControl): void { ListWrapper.remove(this.directives, dir); } - addControlGroup(dir: ControlGroupDirective) {} + addControlGroup(dir: NgControlGroup) {} - removeControlGroup(dir: ControlGroupDirective) {} + removeControlGroup(dir: NgControlGroup) {} - updateModel(dir: ControlDirective, value: any): void { + updateModel(dir: NgControl, value: any): void { var c  = this.form.find(dir.path); c.updateValue(value); } diff --git a/modules/angular2/src/forms/directives/ng_model_directive.ts b/modules/angular2/src/forms/directives/ng_model.ts similarity index 85% rename from modules/angular2/src/forms/directives/ng_model_directive.ts rename to modules/angular2/src/forms/directives/ng_model.ts index 2cf8d83dd6..dba5144f5b 100644 --- a/modules/angular2/src/forms/directives/ng_model_directive.ts +++ b/modules/angular2/src/forms/directives/ng_model.ts @@ -5,12 +5,12 @@ import {StringMapWrapper} from 'angular2/src/facade/collection'; import {Directive, Ancestor, onChange} from 'angular2/angular2'; import {FORWARD_REF, Binding} from 'angular2/di'; -import {ControlDirective} from './control_directive'; +import {NgControl} from './ng_control'; import {Control} from '../model'; import {setUpControl} from './shared'; const formControlBinding = - CONST_EXPR(new Binding(ControlDirective, {toAlias: FORWARD_REF(() => NgModelDirective)})); + CONST_EXPR(new Binding(NgControl, {toAlias: FORWARD_REF(() => NgModel)})); @Directive({ selector: '[ng-model]:not([ng-control]):not([ng-form-control])', @@ -20,7 +20,7 @@ const formControlBinding = lifecycle: [onChange], exportAs: 'form' }) -export class NgModelDirective extends ControlDirective { +export class NgModel extends NgControl { control: Control; ngModel: EventEmitter; model: any; 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 1673414218..72f181944c 100644 --- a/modules/angular2/src/forms/directives/select_control_value_accessor.ts +++ b/modules/angular2/src/forms/directives/select_control_value_accessor.ts @@ -1,5 +1,5 @@ import {Directive} from 'angular2/angular2'; -import {ControlDirective} from './control_directive'; +import {NgControl} from './ng_control'; import {ControlValueAccessor} from './control_value_accessor'; /** @@ -35,7 +35,7 @@ export class SelectControlValueAccessor implements ControlValueAccessor { onChange: Function; onTouched: Function; - constructor(private cd: ControlDirective) { + constructor(private cd: NgControl) { this.onChange = (_) => {}; this.onTouched = (_) => {}; this.value = ''; diff --git a/modules/angular2/src/forms/directives/shared.ts b/modules/angular2/src/forms/directives/shared.ts index 5ee2b68d9d..5e4fbc94bf 100644 --- a/modules/angular2/src/forms/directives/shared.ts +++ b/modules/angular2/src/forms/directives/shared.ts @@ -1,18 +1,18 @@ import {ListWrapper} from 'angular2/src/facade/collection'; import {isBlank, BaseException} from 'angular2/src/facade/lang'; -import {ControlContainerDirective} from './control_container_directive'; -import {ControlDirective} from './control_directive'; +import {ControlContainer} from './control_container'; +import {NgControl} from './ng_control'; import {Control} from '../model'; import {Validators} from '../validators'; -export function controlPath(name, parent: ControlContainerDirective) { +export function controlPath(name, parent: ControlContainer) { var p = ListWrapper.clone(parent.path); ListWrapper.push(p, name); return p; } -export function setUpControl(c: Control, dir: ControlDirective) { +export function setUpControl(c: Control, dir: NgControl) { if (isBlank(c)) _throwError(dir, "Cannot find control"); if (isBlank(dir.valueAccessor)) _throwError(dir, "No value accessor for"); @@ -33,7 +33,7 @@ export function setUpControl(c: Control, dir: ControlDirective) { dir.valueAccessor.registerOnTouched(() => c.markAsTouched()); } -function _throwError(dir: ControlDirective, message: string): void { +function _throwError(dir: NgControl, message: string): void { var path = ListWrapper.join(dir.path, " -> "); throw new BaseException(`${message} '${path}'`); } \ No newline at end of file diff --git a/modules/angular2/src/forms/directives/validators.ts b/modules/angular2/src/forms/directives/validators.ts new file mode 100644 index 0000000000..369894d5d4 --- /dev/null +++ b/modules/angular2/src/forms/directives/validators.ts @@ -0,0 +1,10 @@ +import {Directive} from '../../../angular2'; +import {Validators} from '../validators'; +import {NgControl} from '../directives'; + +@Directive({selector: '[required]'}) +export class NgRequiredValidator { + constructor(c: NgControl) { + c.validator = Validators.compose([c.validator, Validators.required]); + } +} diff --git a/modules/angular2/src/forms/validator_directives.ts b/modules/angular2/src/forms/validator_directives.ts deleted file mode 100644 index 994c08f69a..0000000000 --- a/modules/angular2/src/forms/validator_directives.ts +++ /dev/null @@ -1,10 +0,0 @@ -import {Directive} from 'angular2/angular2'; -import {Validators} from './validators'; -import {ControlDirective} from './directives'; - -@Directive({selector: '[required]'}) -export class RequiredValidatorDirective { - constructor(c: ControlDirective) { - c.validator = Validators.compose([c.validator, Validators.required]); - } -} diff --git a/modules/angular2/test/forms/directives_spec.ts b/modules/angular2/test/forms/directives_spec.ts index 3aae715160..a812d70363 100644 --- a/modules/angular2/test/forms/directives_spec.ts +++ b/modules/angular2/test/forms/directives_spec.ts @@ -16,13 +16,13 @@ import { import { ControlGroup, Control, - ControlNameDirective, - ControlGroupDirective, - FormModelDirective, + NgControlName, + NgControlGroup, + NgFormModel, ControlValueAccessor, Validators, - TemplateDrivenFormDirective, - FormControlDirective + NgForm, + NgFormControl } from 'angular2/forms'; class DummyControlValueAccessor implements ControlValueAccessor { @@ -36,24 +36,24 @@ class DummyControlValueAccessor implements ControlValueAccessor { export function main() { describe("Form Directives", () => { - describe("FormModelDirective", () => { + describe("NgFormModel", () => { var form; var formModel; var loginControlDir; beforeEach(() => { - form = new FormModelDirective(); + form = new NgFormModel(); formModel = new ControlGroup({"login": new Control(null)}); form.form = formModel; - loginControlDir = new ControlNameDirective(form); + loginControlDir = new NgControlName(form); loginControlDir.name = "login"; loginControlDir.valueAccessor = new DummyControlValueAccessor(); }); describe("addControl", () => { it("should throw when no control found", () => { - var dir = new ControlNameDirective(form); + var dir = new NgControlName(form); dir.name = "invalidName"; expect(() => form.addControl(dir)) @@ -61,7 +61,7 @@ export function main() { }); it("should throw when no value accessor", () => { - var dir = new ControlNameDirective(form); + var dir = new NgControlName(form); dir.name = "login"; expect(() => form.addControl(dir)) @@ -114,20 +114,20 @@ export function main() { }); }); - describe("TemplateDrivenFormDirective", () => { + describe("NgForm", () => { var form; var formModel; var loginControlDir; var personControlGroupDir; beforeEach(() => { - form = new TemplateDrivenFormDirective(); + form = new NgForm(); formModel = form.form; - personControlGroupDir = new ControlGroupDirective(form); + personControlGroupDir = new NgControlGroup(form); personControlGroupDir.name = "person"; - loginControlDir = new ControlNameDirective(personControlGroupDir); + loginControlDir = new NgControlName(personControlGroupDir); loginControlDir.name = "login"; loginControlDir.valueAccessor = new DummyControlValueAccessor(); }); @@ -163,12 +163,12 @@ export function main() { }); }); - describe("FormControlDirective", () => { + describe("NgFormControl", () => { var controlDir; var control; beforeEach(() => { - controlDir = new FormControlDirective(); + controlDir = new NgFormControl(); controlDir.valueAccessor = new DummyControlValueAccessor(); control = new Control(null); diff --git a/modules/angular2/test/forms/integration_spec.ts b/modules/angular2/test/forms/integration_spec.ts index 07e21f89f7..63df41bd42 100644 --- a/modules/angular2/test/forms/integration_spec.ts +++ b/modules/angular2/test/forms/integration_spec.ts @@ -24,10 +24,10 @@ import {NgIf} from 'angular2/directives'; import { Control, ControlGroup, - TemplateDrivenFormDirective, + NgForm, formDirectives, Validators, - ControlDirective, + NgControl, ControlValueAccessor } from 'angular2/forms'; @@ -481,7 +481,7 @@ export function main() { .then((view) => { view.detectChanges(); var form = - view.rawView.elementInjectors[0].get(TemplateDrivenFormDirective); + view.rawView.elementInjectors[0].get(NgForm); expect(form.controls['user']).not.toBeDefined(); tick(); @@ -536,7 +536,7 @@ export function main() { .then((view) => { view.detectChanges(); var form = view.rawView.elementInjectors[0].get( - TemplateDrivenFormDirective); + NgForm); tick(); @@ -566,7 +566,7 @@ export function main() { .then((view) => { view.detectChanges(); var form = - view.rawView.elementInjectors[0].get(TemplateDrivenFormDirective); + view.rawView.elementInjectors[0].get(NgForm); flushMicrotasks(); expect(form.controls['user']).toBeDefined(); @@ -739,7 +739,7 @@ class WrappedValue implements ControlValueAccessor { value; onChange: Function; - constructor(cd: ControlDirective) { cd.valueAccessor = this; } + constructor(cd: NgControl) { cd.valueAccessor = this; } writeValue(value) { this.value = `!${value}!`; } diff --git a/modules/examples/src/model_driven_forms/index.ts b/modules/examples/src/model_driven_forms/index.ts index 5e02b0cccc..000b1d5619 100644 --- a/modules/examples/src/model_driven_forms/index.ts +++ b/modules/examples/src/model_driven_forms/index.ts @@ -1,11 +1,5 @@ import {bootstrap, onChange, NgIf, Component, Directive, View, Ancestor} from 'angular2/angular2'; -import { - formDirectives, - ControlDirective, - Validators, - FormModelDirective, - FormBuilder -} from 'angular2/forms'; +import {formDirectives, NgControl, Validators, NgFormModel, FormBuilder} from 'angular2/forms'; import {RegExpWrapper, print, isPresent} from 'angular2/src/facade/lang'; @@ -50,7 +44,7 @@ class ShowError { controlPath: string; errorTypes: List; - constructor(@Ancestor() formDir: FormModelDirective) { this.formDir = formDir; } + constructor(@Ancestor() formDir: NgFormModel) { this.formDir = formDir; } get errorMessage() { var c = this.formDir.form.find(this.controlPath); diff --git a/modules/examples/src/template_driven_forms/index.ts b/modules/examples/src/template_driven_forms/index.ts index e83de51f39..54beef4a12 100644 --- a/modules/examples/src/template_driven_forms/index.ts +++ b/modules/examples/src/template_driven_forms/index.ts @@ -1,10 +1,5 @@ import {bootstrap, onChange, NgIf, Component, Directive, View, Ancestor} from 'angular2/angular2'; -import { - formDirectives, - ControlDirective, - Validators, - TemplateDrivenFormDirective -} from 'angular2/forms'; +import {formDirectives, NgControl, Validators, NgForm} from 'angular2/forms'; import {RegExpWrapper, print, isPresent} from 'angular2/src/facade/lang'; @@ -30,7 +25,7 @@ class CheckoutModel { */ @Directive({selector: '[credit-card]'}) class CreditCardValidator { - constructor(c: ControlDirective) { + constructor(c: NgControl) { c.validator = Validators.compose([c.validator, CreditCardValidator.validate]); } @@ -70,7 +65,7 @@ class ShowError { controlPath: string; errorTypes: List; - constructor(@Ancestor() formDir: TemplateDrivenFormDirective) { this.formDir = formDir; } + constructor(@Ancestor() formDir: NgForm) { this.formDir = formDir; } get errorMessage() { var c = this.formDir.form.find(this.controlPath);