angular-cn/modules/angular2/src/forms/form_builder.ts

126 lines
3.8 KiB
TypeScript
Raw Normal View History

import {StringMapWrapper, ListWrapper, List} from 'angular2/src/facade/collection';
2015-03-10 18:12:50 -07:00
import {isPresent} from 'angular2/src/facade/lang';
import * as modelModule from './model';
2015-03-10 18:12:50 -07:00
/**
2015-04-10 11:15:01 -07:00
* Creates a form object from a user-specified configuration.
*
* # Example
*
2015-04-29 10:33:20 -05:00
* ```
* import {Component, View, bootstrap} from 'angular2/angular2';
* import {FormBuilder, Validators, formDirectives, ControlGroup} from 'angular2/forms';
*
2015-04-29 10:33:20 -05:00
* @Component({
* selector: 'login-comp',
* appInjector: [
2015-04-29 10:33:20 -05:00
* FormBuilder
* ]
* })
* @View({
* template: `
* <form [control-group]="loginForm">
* Login <input control="login">
*
2015-04-29 10:33:20 -05:00
* <div control-group="passwordRetry">
* Password <input type="password" control="password">
* Confirm password <input type="password" control="passwordConfirmation">
* </div>
* </form>
* `,
* directives: [
* formDirectives
2015-04-29 10:33:20 -05:00
* ]
* })
* class LoginComp {
* loginForm: ControlGroup;
*
2015-04-29 10:33:20 -05:00
* constructor(builder: FormBuilder) {
* this.loginForm = builder.group({
* login: ["", Validators.required],
*
2015-04-29 10:33:20 -05:00
* passwordRetry: builder.group({
* password: ["", Validators.required],
* passwordConfirmation: ["", Validators.required]
* })
* });
* }
* }
*
2015-04-29 10:33:20 -05:00
* bootstrap(LoginComp)
* ```
*
* This example creates a {@link ControlGroup} that consists of a `login` {@link Control}, and a
* nested
2015-04-29 10:33:20 -05:00
* {@link ControlGroup} that defines a `password` and a `passwordConfirmation` {@link Control}:
2015-04-10 11:15:01 -07:00
*
* ```
* var loginForm = builder.group({
* login: ["", Validators.required],
*
* passwordRetry: builder.group({
* password: ["", Validators.required],
* passwordConfirmation: ["", Validators.required]
* })
* });
*
* ```
* @exportedAs angular2/forms
*/
2015-03-10 18:12:50 -07:00
export class FormBuilder {
group(controlsConfig: StringMap<string, any>,
extra: StringMap<string, any> = null): modelModule.ControlGroup {
2015-03-10 18:12:50 -07:00
var controls = this._reduceControls(controlsConfig);
var optionals = isPresent(extra) ? StringMapWrapper.get(extra, "optionals") : null;
var validator = isPresent(extra) ? StringMapWrapper.get(extra, "validator") : null;
if (isPresent(validator)) {
return new modelModule.ControlGroup(controls, optionals, validator);
2015-03-10 18:12:50 -07:00
} else {
return new modelModule.ControlGroup(controls, optionals);
2015-03-10 18:12:50 -07:00
}
}
control(value: Object, validator: Function = null): modelModule.Control {
2015-03-10 18:12:50 -07:00
if (isPresent(validator)) {
return new modelModule.Control(value, validator);
2015-03-10 18:12:50 -07:00
} else {
return new modelModule.Control(value);
2015-03-10 18:12:50 -07:00
}
}
array(controlsConfig: List<any>, validator: Function = null): modelModule.ControlArray {
var controls = ListWrapper.map(controlsConfig, (c) => this._createControl(c));
if (isPresent(validator)) {
return new modelModule.ControlArray(controls, validator);
} else {
return new modelModule.ControlArray(controls);
}
}
_reduceControls(controlsConfig: any): StringMap<string, modelModule.AbstractControl> {
2015-03-10 18:12:50 -07:00
var controls = {};
StringMapWrapper.forEach(controlsConfig, (controlConfig, controlName) => {
controls[controlName] = this._createControl(controlConfig);
});
return controls;
}
_createControl(controlConfig: any): modelModule.AbstractControl {
if (controlConfig instanceof modelModule.Control || controlConfig instanceof
modelModule.ControlGroup || controlConfig instanceof
modelModule.ControlArray) {
2015-03-10 18:12:50 -07:00
return controlConfig;
} else if (ListWrapper.isList(controlConfig)) {
var value = ListWrapper.get(controlConfig, 0);
var validator = controlConfig.length > 1 ? controlConfig[1] : null;
return this.control(value, validator);
} else {
return this.control(controlConfig);
}
}
2015-04-10 11:15:01 -07:00
}