angular-cn/packages/forms/src/form_builder.ts

99 lines
3.5 KiB
TypeScript
Raw Normal View History

/**
* @license
* Copyright Google Inc. All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.io/license
*/
2016-06-08 18:36:24 -04:00
import {Injectable} from '@angular/core';
import {AsyncValidatorFn, ValidatorFn} from './directives/validators';
import {AbstractControl, FormArray, FormControl, FormGroup} from './model';
2016-06-08 18:36:24 -04:00
/**
* @description
*
* Creates an `AbstractControl` from a user-specified configuration.
*
* This is essentially syntactic sugar that shortens the `new FormGroup()`,
* `new FormControl()`, and `new FormArray()` boilerplate that can build up in larger
* forms.
*
* To use, inject `FormBuilder` into your component class. You can then call its methods
* directly.
2016-06-08 18:36:24 -04:00
*
* {@example forms/ts/formBuilder/form_builder_example.ts region='Component'}
2016-06-08 18:36:24 -04:00
*
* * **npm package**: `@angular/forms`
*
* * **NgModule**: `ReactiveFormsModule`
2016-06-08 18:36:24 -04:00
*
* @stable
2016-06-08 18:36:24 -04:00
*/
@Injectable()
export class FormBuilder {
/**
* Construct a new `FormGroup` with the given map of configuration.
* Valid keys for the `extra` parameter map are `validator` and `asyncValidator`.
2016-06-08 18:36:24 -04:00
*
* See the `FormGroup` constructor for more details.
2016-06-08 18:36:24 -04:00
*/
group(controlsConfig: {[key: string]: any}, extra: {[key: string]: any}|null = null): FormGroup {
const controls = this._reduceControls(controlsConfig);
2017-03-02 12:37:01 -05:00
const validator: ValidatorFn = extra != null ? extra['validator'] : null;
const asyncValidator: AsyncValidatorFn = extra != null ? extra['asyncValidator'] : null;
return new FormGroup(controls, validator, asyncValidator);
2016-06-08 18:36:24 -04:00
}
/**
* Construct a new `FormControl` with the given `formState`,`validator`, and
* `asyncValidator`.
*
* `formState` can either be a standalone value for the form control or an object
* that contains both a value and a disabled status.
*
2016-06-08 18:36:24 -04:00
*/
control(
formState: any, validator?: ValidatorFn|ValidatorFn[]|null,
asyncValidator?: AsyncValidatorFn|AsyncValidatorFn[]|null): FormControl {
return new FormControl(formState, validator, asyncValidator);
2016-06-08 18:36:24 -04:00
}
/**
* Construct a `FormArray` from the given `controlsConfig` array of
2016-06-08 18:36:24 -04:00
* configuration, with the given optional `validator` and `asyncValidator`.
*/
array(
controlsConfig: any[], validator?: ValidatorFn|ValidatorFn[]|null,
asyncValidator?: AsyncValidatorFn|AsyncValidatorFn[]|null): FormArray {
const controls = controlsConfig.map(c => this._createControl(c));
return new FormArray(controls, validator, asyncValidator);
2016-06-08 18:36:24 -04:00
}
/** @internal */
_reduceControls(controlsConfig: {[k: string]: any}): {[key: string]: AbstractControl} {
const controls: {[key: string]: AbstractControl} = {};
Object.keys(controlsConfig).forEach(controlName => {
controls[controlName] = this._createControl(controlsConfig[controlName]);
2016-06-08 18:36:24 -04:00
});
return controls;
}
/** @internal */
_createControl(controlConfig: any): AbstractControl {
if (controlConfig instanceof FormControl || controlConfig instanceof FormGroup ||
controlConfig instanceof FormArray) {
2016-06-08 18:36:24 -04:00
return controlConfig;
2016-10-19 16:42:39 -04:00
} else if (Array.isArray(controlConfig)) {
const value = controlConfig[0];
const validator: ValidatorFn = controlConfig.length > 1 ? controlConfig[1] : null;
const asyncValidator: AsyncValidatorFn = controlConfig.length > 2 ? controlConfig[2] : null;
2016-06-08 18:36:24 -04:00
return this.control(value, validator, asyncValidator);
} else {
return this.control(controlConfig);
}
}
}