feat(forms): allow both patching and strict setting of values (#10537)

modules/@angular/forms/src/directives/ng_form.ts

@@ -127,7 +127,7 @@ export class NgForm extends ControlContainer implements Form {
     });
   }
 
-  getControl(dir: NgModel): FormControl { return <FormControl>this.form.find(dir.path); }
+  getControl(dir: NgModel): FormControl { return <FormControl>this.form.get(dir.path); }
 
   removeControl(dir: NgModel): void {
     resolvedPromise.then(() => {
@@ -157,16 +157,16 @@ export class NgForm extends ControlContainer implements Form {
     });
   }
 
-  getFormGroup(dir: NgModelGroup): FormGroup { return <FormGroup>this.form.find(dir.path); }
+  getFormGroup(dir: NgModelGroup): FormGroup { return <FormGroup>this.form.get(dir.path); }
 
   updateModel(dir: NgControl, value: any): void {
     resolvedPromise.then(() => {
-      var ctrl = <FormControl>this.form.find(dir.path);
-      ctrl.updateValue(value);
+      var ctrl = <FormControl>this.form.get(dir.path);
+      ctrl.setValue(value);
     });
   }
 
-  updateValue(value: {[key: string]: any}): void { this.control.updateValue(value); }
+  setValue(value: {[key: string]: any}): void { this.control.setValue(value); }
 
   onSubmit(): boolean {
     this._submitted = true;
@@ -179,6 +179,6 @@ export class NgForm extends ControlContainer implements Form {
   /** @internal */
   _findContainer(path: string[]): FormGroup {
     path.pop();
-    return ListWrapper.isEmpty(path) ? this.form : <FormGroup>this.form.find(path);
+    return ListWrapper.isEmpty(path) ? this.form : <FormGroup>this.form.get(path);
   }
 }

modules/@angular/forms/src/directives/ng_model.ts

@@ -152,6 +152,6 @@ export class NgModel extends NgControl implements OnChanges,
 
               private _updateValue(value: any): void {
                 resolvedPromise.then(
-                    () => { this.control.updateValue(value, {emitViewToModelChange: false}); });
+                    () => { this.control.setValue(value, {emitViewToModelChange: false}); });
               }
 }

modules/@angular/forms/src/directives/reactive_directives/form_control_directive.ts

@@ -93,7 +93,7 @@ export class FormControlDirective extends NgControl implements OnChanges {
                   this.form.updateValueAndValidity({emitEvent: false});
                 }
                 if (isPropertyUpdated(changes, this.viewModel)) {
-                  this.form.updateValue(this.model);
+                  this.form.setValue(this.model);
                   this.viewModel = this.model;
                 }
               }

modules/@angular/forms/src/directives/reactive_directives/form_group_directive.ts

@@ -145,39 +145,39 @@ export class FormGroupDirective extends ControlContainer implements Form,
   get path(): string[] { return []; }
 
   addControl(dir: NgControl): void {
-    const ctrl: any = this.form.find(dir.path);
+    const ctrl: any = this.form.get(dir.path);
     setUpControl(ctrl, dir);
     ctrl.updateValueAndValidity({emitEvent: false});
     this.directives.push(dir);
   }
 
-  getControl(dir: NgControl): FormControl { return <FormControl>this.form.find(dir.path); }
+  getControl(dir: NgControl): FormControl { return <FormControl>this.form.get(dir.path); }
 
   removeControl(dir: NgControl): void { ListWrapper.remove(this.directives, dir); }
 
   addFormGroup(dir: FormGroupName): void {
-    var ctrl: any = this.form.find(dir.path);
+    var ctrl: any = this.form.get(dir.path);
     setUpFormContainer(ctrl, dir);
     ctrl.updateValueAndValidity({emitEvent: false});
   }
 
   removeFormGroup(dir: FormGroupName): void {}
 
-  getFormGroup(dir: FormGroupName): FormGroup { return <FormGroup>this.form.find(dir.path); }
+  getFormGroup(dir: FormGroupName): FormGroup { return <FormGroup>this.form.get(dir.path); }
 
   addFormArray(dir: FormArrayName): void {
-    var ctrl: any = this.form.find(dir.path);
+    var ctrl: any = this.form.get(dir.path);
     setUpFormContainer(ctrl, dir);
     ctrl.updateValueAndValidity({emitEvent: false});
   }
 
   removeFormArray(dir: FormArrayName): void {}
 
-  getFormArray(dir: FormArrayName): FormArray { return <FormArray>this.form.find(dir.path); }
+  getFormArray(dir: FormArrayName): FormArray { return <FormArray>this.form.get(dir.path); }
 
   updateModel(dir: NgControl, value: any): void {
-    var ctrl  = <FormControl>this.form.find(dir.path);
-    ctrl.updateValue(value);
+    var ctrl  = <FormControl>this.form.get(dir.path);
+    ctrl.setValue(value);
   }
 
   onSubmit(): boolean {
@@ -191,7 +191,7 @@ export class FormGroupDirective extends ControlContainer implements Form,
   /** @internal */
   _updateDomValue() {
     this.directives.forEach(dir => {
-      var ctrl: any = this.form.find(dir.path);
+      var ctrl: any = this.form.get(dir.path);
       dir.valueAccessor.writeValue(ctrl.value);
     });
   }

modules/@angular/forms/src/directives/shared.ts

@@ -46,7 +46,7 @@ export function setUpControl(control: FormControl, dir: NgControl): void {
   dir.valueAccessor.registerOnChange((newValue: any) => {
     dir.viewToModelUpdate(newValue);
     control.markAsDirty();
-    control.updateValue(newValue, {emitModelToViewChange: false});
+    control.setValue(newValue, {emitModelToViewChange: false});
   });
 
   control.registerOnChange((newValue: any, emitModelEvent: boolean) => {

modules/@angular/forms/src/model.ts

@@ -177,7 +177,9 @@ export abstract class AbstractControl {
 
   setParent(parent: FormGroup|FormArray): void { this._parent = parent; }
 
-  abstract updateValue(value: any, options?: Object): void;
+  abstract setValue(value: any, options?: Object): void;
+
+  abstract patchValue(value: any, options?: Object): void;
 
   abstract reset(value?: any, options?: Object): void;
 
@@ -401,7 +403,7 @@ export class FormControl extends AbstractControl {
    * If `emitViewToModelChange` is `true`, an ngModelChange event will be fired to update the
    * model.  This is the default behavior if `emitViewToModelChange` is not specified.
    */
-  updateValue(value: any, {onlySelf, emitEvent, emitModelToViewChange, emitViewToModelChange}: {
+  setValue(value: any, {onlySelf, emitEvent, emitModelToViewChange, emitViewToModelChange}: {
     onlySelf?: boolean,
     emitEvent?: boolean,
     emitModelToViewChange?: boolean,
@@ -417,10 +419,35 @@ export class FormControl extends AbstractControl {
     this.updateValueAndValidity({onlySelf: onlySelf, emitEvent: emitEvent});
   }
 
+  /**
+   * This function is functionally the same as updateValue() at this level.  It exists for
+   * symmetry with patchValue() on FormGroups and FormArrays, where it does behave differently.
+   */
+  patchValue(value: any, options: {
+    onlySelf?: boolean,
+    emitEvent?: boolean,
+    emitModelToViewChange?: boolean,
+    emitViewToModelChange?: boolean
+  } = {}): void {
+    this.setValue(value, options);
+  }
+
+  /**
+   * @deprecated Please use setValue() instead.
+   */
+  updateValue(value: any, options: {
+    onlySelf?: boolean,
+    emitEvent?: boolean,
+    emitModelToViewChange?: boolean,
+    emitViewToModelChange?: boolean
+  } = {}): void {
+    this.setValue(value, options);
+  }
+
   reset(value: any = null, {onlySelf}: {onlySelf?: boolean} = {}): void {
     this.markAsPristine({onlySelf: onlySelf});
     this.markAsUntouched({onlySelf: onlySelf});
-    this.updateValue(value, {onlySelf: onlySelf});
+    this.setValue(value, {onlySelf: onlySelf});
   }
 
   /**
@@ -523,10 +550,20 @@ export class FormGroup extends AbstractControl {
     return c && this._included(controlName);
   }
 
-  updateValue(value: {[key: string]: any}, {onlySelf}: {onlySelf?: boolean} = {}): void {
+  setValue(value: {[key: string]: any}, {onlySelf}: {onlySelf?: boolean} = {}): void {
+    this._checkAllValuesPresent(value);
     StringMapWrapper.forEach(value, (newValue: any, name: string) => {
       this._throwIfControlMissing(name);
-      this.controls[name].updateValue(newValue, {onlySelf: true});
+      this.controls[name].setValue(newValue, {onlySelf: true});
+    });
+    this.updateValueAndValidity({onlySelf: onlySelf});
+  }
+
+  patchValue(value: {[key: string]: any}, {onlySelf}: {onlySelf?: boolean} = {}): void {
+    StringMapWrapper.forEach(value, (newValue: any, name: string) => {
+      if (this.controls[name]) {
+        this.controls[name].patchValue(newValue, {onlySelf: true});
+      }
     });
     this.updateValueAndValidity({onlySelf: onlySelf});
   }
@@ -542,6 +579,12 @@ export class FormGroup extends AbstractControl {
 
   /** @internal */
   _throwIfControlMissing(name: string): void {
+    if (!Object.keys(this.controls).length) {
+      throw new BaseException(`
+        There are no form controls registered with this group yet.  If you're using ngModel,
+        you may want to check next tick (e.g. use setTimeout).
+      `);
+    }
     if (!this.controls[name]) {
       throw new BaseException(`Cannot find form control with name: ${name}.`);
     }
@@ -594,6 +637,15 @@ export class FormGroup extends AbstractControl {
     var isOptional = StringMapWrapper.contains(this._optionals, controlName);
     return !isOptional || StringMapWrapper.get(this._optionals, controlName);
   }
+
+  /** @internal */
+  _checkAllValuesPresent(value: any): void {
+    this._forEachChild((control: AbstractControl, name: string) => {
+      if (value[name] === undefined) {
+        throw new BaseException(`Must supply a value for form control with name: '${name}'.`);
+      }
+    });
+  }
 }
 
 /**
@@ -666,10 +718,20 @@ export class FormArray extends AbstractControl {
    */
   get length(): number { return this.controls.length; }
 
-  updateValue(value: any[], {onlySelf}: {onlySelf?: boolean} = {}): void {
+  setValue(value: any[], {onlySelf}: {onlySelf?: boolean} = {}): void {
+    this._checkAllValuesPresent(value);
     value.forEach((newValue: any, index: number) => {
       this._throwIfControlMissing(index);
-      this.at(index).updateValue(newValue, {onlySelf: true});
+      this.at(index).setValue(newValue, {onlySelf: true});
+    });
+    this.updateValueAndValidity({onlySelf: onlySelf});
+  }
+
+  patchValue(value: any[], {onlySelf}: {onlySelf?: boolean} = {}): void {
+    value.forEach((newValue: any, index: number) => {
+      if (this.at(index)) {
+        this.at(index).patchValue(newValue, {onlySelf: true});
+      }
     });
     this.updateValueAndValidity({onlySelf: onlySelf});
   }
@@ -685,6 +747,12 @@ export class FormArray extends AbstractControl {
 
   /** @internal */
   _throwIfControlMissing(index: number): void {
+    if (!this.controls.length) {
+      throw new BaseException(`
+        There are no form controls registered with this array yet.  If you're using ngModel,
+        you may want to check next tick (e.g. use setTimeout).
+      `);
+    }
     if (!this.at(index)) {
       throw new BaseException(`Cannot find form control at index ${index}`);
     }
@@ -707,4 +775,13 @@ export class FormArray extends AbstractControl {
   _setParentForControls(): void {
     this._forEachChild((control: AbstractControl) => { control.setParent(this); });
   }
+
+  /** @internal */
+  _checkAllValuesPresent(value: any): void {
+    this._forEachChild((control: AbstractControl, i: number) => {
+      if (value[i] === undefined) {
+        throw new BaseException(`Must supply a value for form control at index: ${i}.`);
+      }
+    });
+  }
 }