patchValue and setValue in Angular

[puddlejumper26]

Demo

inside this demo, if we set

updateProfile() {
    this.profileForm.patchValue({     <====
      firstName: 'dddddd',
      lastName: '3333',
      address: {
        street: '123 Drew Street',
        city:'Mmmm'
      }
    });
  }

than the browser would be like this

if we set like this

updateProfile() {
    this.profileForm.setValue({
      firstName: 'dddddd',
      lastName: '3333',
      address: {
        street: '123 Drew Street',
        city:'Mmmm'
      }
    });
  }

Notice above the input are empty, and the Error is : Must supply a value for form control with name: ***.

Reference

[1] https://angular.io/guide/reactive-forms#patching-the-model-value