feat(forms): added pristine and dirty
This commit is contained in:
53
modules/angular2/src/forms/model.js
vendored
53
modules/angular2/src/forms/model.js
vendored
@ -11,6 +11,8 @@ export const INVALID = "INVALID";
|
|||||||
// get status():string;
|
// get status():string;
|
||||||
// get valid():boolean;
|
// get valid():boolean;
|
||||||
// get errors():Map;
|
// get errors():Map;
|
||||||
|
// get pristine():boolean;
|
||||||
|
// get dirty():boolean;
|
||||||
// updateValue(value:any){}
|
// updateValue(value:any){}
|
||||||
// setParent(parent){}
|
// setParent(parent){}
|
||||||
//}
|
//}
|
||||||
@ -19,13 +21,15 @@ export class AbstractControl {
|
|||||||
_value:any;
|
_value:any;
|
||||||
_status:string;
|
_status:string;
|
||||||
_errors;
|
_errors;
|
||||||
_dirty:boolean;
|
_updateNeeded:boolean;
|
||||||
|
_pristine:boolean;
|
||||||
_parent:ControlGroup;
|
_parent:ControlGroup;
|
||||||
validator:Function;
|
validator:Function;
|
||||||
|
|
||||||
constructor(validator:Function = nullValidator) {
|
constructor(validator:Function = nullValidator) {
|
||||||
this.validator = validator;
|
this.validator = validator;
|
||||||
this._dirty = true;
|
this._updateNeeded = true;
|
||||||
|
this._pristine = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
get value() {
|
get value() {
|
||||||
@ -48,6 +52,15 @@ export class AbstractControl {
|
|||||||
return this._errors;
|
return this._errors;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
get pristine() {
|
||||||
|
this._updateIfNeeded();
|
||||||
|
return this._pristine;
|
||||||
|
}
|
||||||
|
|
||||||
|
get dirty() {
|
||||||
|
return ! this.pristine;
|
||||||
|
}
|
||||||
|
|
||||||
setParent(parent){
|
setParent(parent){
|
||||||
this._parent = parent;
|
this._parent = parent;
|
||||||
}
|
}
|
||||||
@ -70,13 +83,14 @@ export class Control extends AbstractControl {
|
|||||||
|
|
||||||
updateValue(value:any) {
|
updateValue(value:any) {
|
||||||
this._value = value;
|
this._value = value;
|
||||||
this._dirty = true;
|
this._updateNeeded = true;
|
||||||
|
this._pristine = false;
|
||||||
this._updateParent();
|
this._updateParent();
|
||||||
}
|
}
|
||||||
|
|
||||||
_updateIfNeeded() {
|
_updateIfNeeded() {
|
||||||
if (this._dirty) {
|
if (this._updateNeeded) {
|
||||||
this._dirty = false;
|
this._updateNeeded = false;
|
||||||
this._errors = this.validator(this);
|
this._errors = this.validator(this);
|
||||||
this._status = isPresent(this._errors) ? INVALID : VALID;
|
this._status = isPresent(this._errors) ? INVALID : VALID;
|
||||||
}
|
}
|
||||||
@ -95,12 +109,12 @@ export class ControlGroup extends AbstractControl {
|
|||||||
}
|
}
|
||||||
|
|
||||||
include(controlName:string) {
|
include(controlName:string) {
|
||||||
this._dirty = true;
|
this._updateNeeded = true;
|
||||||
StringMapWrapper.set(this.optionals, controlName, true);
|
StringMapWrapper.set(this.optionals, controlName, true);
|
||||||
}
|
}
|
||||||
|
|
||||||
exclude(controlName:string) {
|
exclude(controlName:string) {
|
||||||
this._dirty = true;
|
this._updateNeeded = true;
|
||||||
StringMapWrapper.set(this.optionals, controlName, false);
|
StringMapWrapper.set(this.optionals, controlName, false);
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -116,26 +130,39 @@ export class ControlGroup extends AbstractControl {
|
|||||||
}
|
}
|
||||||
|
|
||||||
_updateIfNeeded() {
|
_updateIfNeeded() {
|
||||||
if (this._dirty) {
|
if (this._updateNeeded) {
|
||||||
this._dirty = false;
|
this._updateNeeded = false;
|
||||||
this._value = this._reduceValue();
|
this._value = this._reduceValue();
|
||||||
|
this._pristine = this._reducePristine();
|
||||||
this._errors = this.validator(this);
|
this._errors = this.validator(this);
|
||||||
this._status = isPresent(this._errors) ? INVALID : VALID;
|
this._status = isPresent(this._errors) ? INVALID : VALID;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
_reduceValue() {
|
_reduceValue() {
|
||||||
var newValue = {};
|
return this._reduceChildren({}, (acc, control, name) => {
|
||||||
|
acc[name] = control.value;
|
||||||
|
return acc;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
_reducePristine() {
|
||||||
|
return this._reduceChildren(true,
|
||||||
|
(acc, control, name) => acc && control.pristine);
|
||||||
|
}
|
||||||
|
|
||||||
|
_reduceChildren(initValue, fn:Function) {
|
||||||
|
var res = initValue;
|
||||||
StringMapWrapper.forEach(this.controls, (control, name) => {
|
StringMapWrapper.forEach(this.controls, (control, name) => {
|
||||||
if (this._included(name)) {
|
if (this._included(name)) {
|
||||||
newValue[name] = control.value;
|
res = fn(res, control, name);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
return newValue;
|
return res;
|
||||||
}
|
}
|
||||||
|
|
||||||
_controlChanged() {
|
_controlChanged() {
|
||||||
this._dirty = true;
|
this._updateNeeded = true;
|
||||||
this._updateParent();
|
this._updateParent();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
43
modules/angular2/test/forms/model_spec.js
vendored
43
modules/angular2/test/forms/model_spec.js
vendored
@ -22,6 +22,32 @@ export function main() {
|
|||||||
expect(c.errors).toEqual({"required" : true});
|
expect(c.errors).toEqual({"required" : true});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
describe("pristine", () => {
|
||||||
|
it("should be true after creating a control", () => {
|
||||||
|
var c = new Control("value");
|
||||||
|
expect(c.pristine).toEqual(true);
|
||||||
|
});
|
||||||
|
|
||||||
|
it("should be false after changing the value of the control", () => {
|
||||||
|
var c = new Control("value");
|
||||||
|
c.updateValue("new value");
|
||||||
|
expect(c.pristine).toEqual(false);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe("dirty", () => {
|
||||||
|
it("should be false after creating a control", () => {
|
||||||
|
var c = new Control("value");
|
||||||
|
expect(c.dirty).toEqual(false);
|
||||||
|
});
|
||||||
|
|
||||||
|
it("should be true after changing the value of the control", () => {
|
||||||
|
var c = new Control("value");
|
||||||
|
c.updateValue("new value");
|
||||||
|
expect(c.dirty).toEqual(true);
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
describe("ControlGroup", () => {
|
describe("ControlGroup", () => {
|
||||||
@ -85,6 +111,23 @@ export function main() {
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
describe("pristine", () => {
|
||||||
|
it("should be true after creating a control", () => {
|
||||||
|
var c = new Control('value');
|
||||||
|
var g = new ControlGroup({"one": c});
|
||||||
|
|
||||||
|
expect(g.pristine).toEqual(true);
|
||||||
|
});
|
||||||
|
|
||||||
|
it("should be false after changing the value of the control", () => {
|
||||||
|
var c = new Control('value');
|
||||||
|
var g = new ControlGroup({"one": c});
|
||||||
|
c.updateValue('new value');
|
||||||
|
|
||||||
|
expect(g.pristine).toEqual(false);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
describe("optional components", () => {
|
describe("optional components", () => {
|
||||||
describe("contains", () => {
|
describe("contains", () => {
|
||||||
var group;
|
var group;
|
||||||
|
Reference in New Issue
Block a user