fix(forms): handle control change in NgFormControl
when a new Control instance is bound to the directive, use the new instance, not the old one
This commit is contained in:
parent
485c85bfe7
commit
d29a9a99aa
|
@ -8,7 +8,7 @@ import {NgControl} from './ng_control';
|
|||
import {Control} from '../model';
|
||||
import {Validators, NG_VALIDATORS} from '../validators';
|
||||
import {ControlValueAccessor, NG_VALUE_ACCESSOR} from './control_value_accessor';
|
||||
import {setUpControl, isPropertyUpdated, selectValueAccessor} from './shared';
|
||||
import {setUpControl, isPropertyUpdated, isControlChanged, selectValueAccessor} from './shared';
|
||||
|
||||
const formControlBinding =
|
||||
CONST_EXPR(new Provider(NgControl, {useExisting: forwardRef(() => NgFormControl)}));
|
||||
|
@ -70,8 +70,6 @@ const formControlBinding =
|
|||
export class NgFormControl extends NgControl implements OnChanges {
|
||||
form: Control;
|
||||
update = new EventEmitter();
|
||||
/** @internal */
|
||||
_added = false;
|
||||
model: any;
|
||||
viewModel: any;
|
||||
validators: Function[];
|
||||
|
@ -84,10 +82,9 @@ export class NgFormControl extends NgControl implements OnChanges {
|
|||
}
|
||||
|
||||
onChanges(changes: {[key: string]: SimpleChange}): void {
|
||||
if (!this._added) {
|
||||
if (isControlChanged(changes)) {
|
||||
setUpControl(this.form, this);
|
||||
this.form.updateValidity();
|
||||
this._added = true;
|
||||
}
|
||||
if (isPropertyUpdated(changes, this.viewModel)) {
|
||||
this.form.updateValue(this.model);
|
||||
|
|
|
@ -60,6 +60,12 @@ export function isPropertyUpdated(changes: {[key: string]: any}, viewModel: any)
|
|||
return !looseIdentical(viewModel, change.currentValue);
|
||||
}
|
||||
|
||||
export function isControlChanged(changes: {[key: string]: any}): boolean {
|
||||
if (!StringMapWrapper.contains(changes, "form")) return false;
|
||||
var change = changes["form"];
|
||||
return change.previousValue !== change.currentValue;
|
||||
}
|
||||
|
||||
// TODO: vsavkin remove it once https://github.com/angular/angular/issues/3011 is implemented
|
||||
export function selectValueAccessor(dir: NgControl, valueAccessors: ControlValueAccessor[]):
|
||||
ControlValueAccessor {
|
||||
|
|
|
@ -38,6 +38,7 @@ import {
|
|||
|
||||
import {selectValueAccessor} from 'angular2/src/core/forms/directives/shared';
|
||||
|
||||
import {SimpleChange} from 'angular2/src/core/change_detection';
|
||||
|
||||
class DummyControlValueAccessor implements ControlValueAccessor {
|
||||
writtenValue;
|
||||
|
@ -275,6 +276,16 @@ export function main() {
|
|||
describe("NgFormControl", () => {
|
||||
var controlDir;
|
||||
var control;
|
||||
var checkProperties = function(control) {
|
||||
expect(controlDir.control).toBe(control);
|
||||
expect(controlDir.value).toBe(control.value);
|
||||
expect(controlDir.valid).toBe(control.valid);
|
||||
expect(controlDir.errors).toBe(control.errors);
|
||||
expect(controlDir.pristine).toBe(control.pristine);
|
||||
expect(controlDir.dirty).toBe(control.dirty);
|
||||
expect(controlDir.touched).toBe(control.touched);
|
||||
expect(controlDir.untouched).toBe(control.untouched);
|
||||
};
|
||||
|
||||
beforeEach(() => {
|
||||
controlDir = new NgFormControl([], [defaultAccessor]);
|
||||
|
@ -284,15 +295,14 @@ export function main() {
|
|||
controlDir.form = control;
|
||||
});
|
||||
|
||||
it("should reexport control properties", () => {
|
||||
expect(controlDir.control).toBe(control);
|
||||
expect(controlDir.value).toBe(control.value);
|
||||
expect(controlDir.valid).toBe(control.valid);
|
||||
expect(controlDir.errors).toBe(control.errors);
|
||||
expect(controlDir.pristine).toBe(control.pristine);
|
||||
expect(controlDir.dirty).toBe(control.dirty);
|
||||
expect(controlDir.touched).toBe(control.touched);
|
||||
expect(controlDir.untouched).toBe(control.untouched);
|
||||
it("should reexport control properties", () => { checkProperties(control); });
|
||||
|
||||
it("should reexport new control properties", () => {
|
||||
var newControl = new Control(null);
|
||||
controlDir.form = newControl;
|
||||
controlDir.onChanges({"form": new SimpleChange(control, newControl)});
|
||||
|
||||
checkProperties(newControl);
|
||||
});
|
||||
|
||||
it("should set up validator", () => {
|
||||
|
@ -301,7 +311,7 @@ export function main() {
|
|||
expect(control.valid).toBe(true);
|
||||
|
||||
// this will add the required validator and recalculate the validity
|
||||
controlDir.onChanges({});
|
||||
controlDir.onChanges({"form": new SimpleChange(null, control)});
|
||||
|
||||
expect(control.valid).toBe(false);
|
||||
});
|
||||
|
|
Loading…
Reference in New Issue