From 1c322f13e5e71f4ed83a949e2ecd1cce0969ada2 Mon Sep 17 00:00:00 2001 From: vsavkin Date: Mon, 2 Nov 2015 10:00:56 -0800 Subject: [PATCH] feat(forms): update FormBuilder to support async validations Closes #5020 --- .../angular2/src/core/forms/form_builder.ts | 36 +++++++------------ .../test/core/forms/form_builder_spec.ts | 28 ++++++++++----- 2 files changed, 33 insertions(+), 31 deletions(-) diff --git a/modules/angular2/src/core/forms/form_builder.ts b/modules/angular2/src/core/forms/form_builder.ts index f43b7832bb..af827e5324 100644 --- a/modules/angular2/src/core/forms/form_builder.ts +++ b/modules/angular2/src/core/forms/form_builder.ts @@ -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); diff --git a/modules/angular2/test/core/forms/form_builder_spec.ts b/modules/angular2/test/core/forms/form_builder_spec.ts index d9874a2cf2..6f0492184a 100644 --- a/modules/angular2/test/core/forms/form_builder_spec.ts +++ b/modules/angular2/test/core/forms/form_builder_spec.ts @@ -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); }); }); }