diff --git a/modules/angular2/src/common/forms/directives/number_value_accessor.ts b/modules/angular2/src/common/forms/directives/number_value_accessor.ts index 875e88a7a4..ae40d1752d 100644 --- a/modules/angular2/src/common/forms/directives/number_value_accessor.ts +++ b/modules/angular2/src/common/forms/directives/number_value_accessor.ts @@ -35,7 +35,7 @@ export class NumberValueAccessor implements ControlValueAccessor { } registerOnChange(fn: (_: number) => void): void { - this.onChange = (value) => { fn(NumberWrapper.parseFloat(value)); }; + this.onChange = (value) => { fn(value == '' ? null : NumberWrapper.parseFloat(value)); }; } registerOnTouched(fn: () => void): void { this.onTouched = fn; } } diff --git a/modules/angular2/test/common/forms/integration_spec.ts b/modules/angular2/test/common/forms/integration_spec.ts index 3b1bde2dbd..956549f96c 100644 --- a/modules/angular2/test/common/forms/integration_spec.ts +++ b/modules/angular2/test/common/forms/integration_spec.ts @@ -343,6 +343,53 @@ export function main() { }); })); + it("should support when value is cleared in the UI", + inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => { + var t = `
+ +
`; + + tcb.overrideTemplate(MyComp, t).createAsync(MyComp).then((fixture) => { + fixture.debugElement.componentInstance.form = + new ControlGroup({"num": new Control(10)}); + fixture.detectChanges(); + + var input = fixture.debugElement.query(By.css("input")); + input.nativeElement.value = ""; + dispatchEvent(input.nativeElement, "input"); + + expect(fixture.debugElement.componentInstance.form.valid).toBe(false); + expect(fixture.debugElement.componentInstance.form.value).toEqual({"num": null}); + + input.nativeElement.value = "0"; + dispatchEvent(input.nativeElement, "input"); + + expect(fixture.debugElement.componentInstance.form.valid).toBe(true); + expect(fixture.debugElement.componentInstance.form.value).toEqual({"num": 0}); + async.done(); + }); + })); + + + it("should support when value is cleared programmatically", + inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => { + var form = new ControlGroup({"num": new Control(10)}); + var t = `
+ +
`; + + tcb.overrideTemplate(MyComp, t).createAsync(MyComp).then((fixture) => { + fixture.debugElement.componentInstance.form = form; + fixture.debugElement.componentInstance.data = null; + fixture.detectChanges(); + + var input = fixture.debugElement.query(By.css("input")); + expect(input.nativeElement.value).toEqual(""); + + async.done(); + }); + })); + it("should support ", inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => { var t = `