feat(forms): update FormBuilder to support async validations

Closes #5020
This commit is contained in:
vsavkin 2015-11-02 10:00:56 -08:00 committed by Victor Savkin
parent 31c12af81f
commit 1c322f13e5
2 changed files with 33 additions and 31 deletions

View File

@ -34,7 +34,7 @@ import * as modelModule from './model';
* login: ["", Validators.required],
* passwordRetry: builder.group({
* password: ["", Validators.required],
* passwordConfirmation: ["", Validators.required]
* passwordConfirmation: ["", Validators.required, asyncValidator]
* })
* });
* }
@ -58,36 +58,25 @@ export class FormBuilder {
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);
} else {
return new modelModule.ControlGroup(controls, optionals);
}
var asyncValidator = isPresent(extra) ? StringMapWrapper.get(extra, "asyncValidator") : null;
return new modelModule.ControlGroup(controls, optionals, validator, asyncValidator);
}
/**
* Construct a new {@link Control} with the given `value` and `validator`.
* Construct a new {@link Control} with the given `value`,`validator`, and `asyncValidator`.
*/
control(value: Object, validator: Function = null): modelModule.Control {
if (isPresent(validator)) {
return new modelModule.Control(value, validator);
} else {
return new modelModule.Control(value);
}
control(value: Object, validator: Function = null,
asyncValidator: Function = null): modelModule.Control {
return new modelModule.Control(value, validator, asyncValidator);
}
/**
* Construct an array of {@link Control}s from the given `controlsConfig` array of
* configuration, with the given optional `validator`.
* configuration, with the given optional `validator` and `asyncValidator`.
*/
array(controlsConfig: any[], validator: Function = null): modelModule.ControlArray {
array(controlsConfig: any[], validator: Function = null,
asyncValidator: Function = null): modelModule.ControlArray {
var controls = controlsConfig.map(c => this._createControl(c));
if (isPresent(validator)) {
return new modelModule.ControlArray(controls, validator);
} else {
return new modelModule.ControlArray(controls);
}
return new modelModule.ControlArray(controls, validator, asyncValidator);
}
/** @internal */
@ -109,7 +98,8 @@ export class FormBuilder {
} else if (isArray(controlConfig)) {
var value = controlConfig[0];
var validator = controlConfig.length > 1 ? controlConfig[1] : null;
return this.control(value, validator);
var asyncValidator = controlConfig.length > 2 ? controlConfig[2] : null;
return this.control(value, validator, asyncValidator);
} else {
return this.control(controlConfig);

View File

@ -9,9 +9,13 @@ import {
afterEach,
el
} from 'angular2/testing_internal';
import {Control, FormBuilder, Validators} from 'angular2/core';
import {Control, FormBuilder} from 'angular2/core';
import {PromiseWrapper} from 'angular2/src/core/facade/promise';
export function main() {
function syncValidator(_) { return null; }
function asyncValidator(_) { return PromiseWrapper.resolve(null); }
describe("Form Builder", () => {
var b;
@ -24,18 +28,21 @@ export function main() {
});
it("should create controls from an array", () => {
var g = b.group({"login": ["some value"], "password": ["some value", Validators.required]});
var g = b.group(
{"login": ["some value"], "password": ["some value", syncValidator, asyncValidator]});
expect(g.controls["login"].value).toEqual("some value");
expect(g.controls["password"].value).toEqual("some value");
expect(g.controls["password"].validator).toEqual(Validators.required);
expect(g.controls["password"].validator).toEqual(syncValidator);
expect(g.controls["password"].asyncValidator).toEqual(asyncValidator);
});
it("should use controls", () => {
var g = b.group({"login": b.control("some value", Validators.required)});
var g = b.group({"login": b.control("some value", syncValidator, asyncValidator)});
expect(g.controls["login"].value).toEqual("some value");
expect(g.controls["login"].validator).toBe(Validators.required);
expect(g.controls["login"].validator).toBe(syncValidator);
expect(g.controls["login"].asyncValidator).toBe(asyncValidator);
});
it("should create groups with optional controls", () => {
@ -45,16 +52,21 @@ export function main() {
});
it("should create groups with a custom validator", () => {
var g = b.group({"login": "some value"}, {"validator": Validators.nullValidator});
var g = b.group({"login": "some value"},
{"validator": syncValidator, "asyncValidator": asyncValidator});
expect(g.validator).toBe(Validators.nullValidator);
expect(g.validator).toBe(syncValidator);
expect(g.asyncValidator).toBe(asyncValidator);
});
it("should create control arrays", () => {
var c = b.control("three");
var a = b.array(["one", ["two", Validators.required], c, b.array(['four'])]);
var a = b.array(["one", ["two", syncValidator], c, b.array(['four'])], syncValidator,
asyncValidator);
expect(a.value).toEqual(['one', 'two', 'three', ['four']]);
expect(a.validator).toBe(syncValidator);
expect(a.asyncValidator).toBe(asyncValidator);
});
});
}