diff --git a/modules/angular2/src/core/forms/directives/abstract_control_directive.ts b/modules/angular2/src/core/forms/directives/abstract_control_directive.ts index 05fe23bc0b..85f898fef9 100644 --- a/modules/angular2/src/core/forms/directives/abstract_control_directive.ts +++ b/modules/angular2/src/core/forms/directives/abstract_control_directive.ts @@ -2,6 +2,11 @@ import {AbstractControl} from '../model'; import {isPresent} from 'angular2/src/core/facade/lang'; import {unimplemented} from 'angular2/src/core/facade/exceptions'; +/** + * Base class for control directives. + * + * Only used internally in the forms module. + */ export abstract class AbstractControlDirective { get control(): AbstractControl { return unimplemented(); } diff --git a/modules/angular2/src/core/forms/directives/checkbox_value_accessor.ts b/modules/angular2/src/core/forms/directives/checkbox_value_accessor.ts index 7d6df78845..256b949531 100644 --- a/modules/angular2/src/core/forms/directives/checkbox_value_accessor.ts +++ b/modules/angular2/src/core/forms/directives/checkbox_value_accessor.ts @@ -15,7 +15,7 @@ const CHECKBOX_VALUE_ACCESSOR = CONST_EXPR(new Provider( * * ### Example * ``` - * + * * ``` */ @Directive({ diff --git a/modules/angular2/src/core/forms/directives/control_container.ts b/modules/angular2/src/core/forms/directives/control_container.ts index ae37aab62a..a84ad46430 100644 --- a/modules/angular2/src/core/forms/directives/control_container.ts +++ b/modules/angular2/src/core/forms/directives/control_container.ts @@ -2,12 +2,20 @@ import {Form} from './form_interface'; import {AbstractControlDirective} from './abstract_control_directive'; /** - * A directive that contains multiple {@link NgControl}. + * A directive that contains multiple {@link NgControl}s. * * Only used by the forms module. */ export class ControlContainer extends AbstractControlDirective { name: string; + + /** + * Get the form to which this container belongs. + */ get formDirective(): Form { return null; } + + /** + * Get the path to this container. + */ get path(): string[] { return null; } } diff --git a/modules/angular2/src/core/forms/directives/control_value_accessor.ts b/modules/angular2/src/core/forms/directives/control_value_accessor.ts index 3ceba8f389..9c0cf781da 100644 --- a/modules/angular2/src/core/forms/directives/control_value_accessor.ts +++ b/modules/angular2/src/core/forms/directives/control_value_accessor.ts @@ -4,11 +4,25 @@ import {OpaqueToken} from 'angular2/src/core/di'; /** * A bridge between a control and a native element. * + * A `ControlValueAccessor` abstracts the operations of writing a new value to a + * DOM element representing an input control. + * * Please see {@link DefaultValueAccessor} for more information. */ export interface ControlValueAccessor { + /** + * Write a new value to the element. + */ writeValue(obj: any): void; + + /** + * Set the function to be called when the control receives a change event. + */ registerOnChange(fn: any): void; + + /** + * Set the function to be called when the control receives a touch event. + */ registerOnTouched(fn: any): void; } diff --git a/modules/angular2/src/core/forms/directives/default_value_accessor.ts b/modules/angular2/src/core/forms/directives/default_value_accessor.ts index 9c1d017a29..fa23a0870e 100644 --- a/modules/angular2/src/core/forms/directives/default_value_accessor.ts +++ b/modules/angular2/src/core/forms/directives/default_value_accessor.ts @@ -15,7 +15,7 @@ const DEFAULT_VALUE_ACCESSOR = CONST_EXPR(new Provider( * * ### Example * ``` - * + * * ``` */ @Directive({ diff --git a/modules/angular2/src/core/forms/directives/form_interface.ts b/modules/angular2/src/core/forms/directives/form_interface.ts index f23e26f7d3..7e3f04651c 100644 --- a/modules/angular2/src/core/forms/directives/form_interface.ts +++ b/modules/angular2/src/core/forms/directives/form_interface.ts @@ -8,11 +8,38 @@ import {Control, ControlGroup} from '../model'; * Only used by the forms module. */ export interface Form { + /** + * Add a control to this form. + */ addControl(dir: NgControl): void; + + /** + * Remove a control from this form. + */ removeControl(dir: NgControl): void; + + /** + * Look up the {@link Control} associated with a particular {@link NgControl}. + */ getControl(dir: NgControl): Control; + + /** + * Add a group of controls to this form. + */ addControlGroup(dir: NgControlGroup): void; + + /** + * Remove a group of controls from this form. + */ removeControlGroup(dir: NgControlGroup): void; + + /** + * Look up the {@link ControlGroup} associated with a particular {@link NgControlGroup}. + */ getControlGroup(dir: NgControlGroup): ControlGroup; + + /** + * Update the model for a particular control with a new value. + */ updateModel(dir: NgControl, value: any): void; } \ No newline at end of file diff --git a/modules/angular2/src/core/forms/directives/ng_control.ts b/modules/angular2/src/core/forms/directives/ng_control.ts index cc175b7bd8..8ec16089a0 100644 --- a/modules/angular2/src/core/forms/directives/ng_control.ts +++ b/modules/angular2/src/core/forms/directives/ng_control.ts @@ -5,11 +5,9 @@ import {unimplemented} from 'angular2/src/core/facade/exceptions'; /** * A base class that all control directive extend. * It binds a {@link Control} object to a DOM element. + * + * Used internally by Angular forms. */ -// Cannot currently be abstract because it would contain -// an abstract method in the public API, and we cannot reflect -// on that in Dart due to https://github.com/dart-lang/sdk/issues/18721 -// Also we don't have abstract setters, see https://github.com/Microsoft/TypeScript/issues/4669 export abstract class NgControl extends AbstractControlDirective { name: string = null; valueAccessor: ControlValueAccessor = null; diff --git a/modules/angular2/src/core/forms/directives/ng_control_group.ts b/modules/angular2/src/core/forms/directives/ng_control_group.ts index cec893902d..94ae2876ee 100644 --- a/modules/angular2/src/core/forms/directives/ng_control_group.ts +++ b/modules/angular2/src/core/forms/directives/ng_control_group.ts @@ -10,7 +10,7 @@ import {ControlGroup} from '../model'; import {Form} from './form_interface'; import {Validators, NG_VALIDATORS} from '../validators'; -const controlGroupBinding = +const controlGroupProvider = CONST_EXPR(new Provider(ControlContainer, {useExisting: forwardRef(() => NgControlGroup)})); /** @@ -18,42 +18,52 @@ const controlGroupBinding = * * This directive can only be used as a child of {@link NgForm} or {@link NgFormModel}. * - * ### Example + * # Example ([live demo](http://plnkr.co/edit/7EJ11uGeaggViYM6T5nq?p=preview)) * - * In this example, we create the credentials and personal control groups. - * We can work with each group separately: check its validity, get its value, listen to its changes. - * - * ``` + * ```typescript * @Component({ - * selector: "signup-comp", - * directives: [FORM_DIRECTIVES], - * template: ` - *
- * `}) - * class SignupComp { - * onSignUp(value) { - * // value === { - * // personal: {name: 'some name'}, - * // credentials: {login: 'some login', password: 'some password'}} - * } + * selector: 'my-app', + * directives: [FORM_DIRECTIVES], + * }) + * @View({ + * template: ` + *