Angular: How to make ChangeDetector work with nulls and no spaces with PatchValue

Question

I am doing Patch Value to set a value of a field. Currently using Reactive forms.

Setting patchValue works.

this.addressForm.patchValue({city:'Atlanta'});

Now when trying to clear/reset the field, patchvalue works only with 1 space

this.addressForm.patchValue({city:' '});
this.cdr.detectChanges();

it does not work with null or '' (0 space)

Is there a way to make ChangeDetection work with null?

Resources:

Angular FormGroup won't update it's value immediately after patchValue or setValue

Answer 1

I think what you are doing is trying to patch a value that does not have that property:

Use the patchValue() method to replace any properties defined in the object that have changed in the form model.

My guess is that your input does not have the property.

That would be because you are changing the value to string and even if you have set the value before, then it is updated.

Ofcourse the string does not contain the city property.

Ok, Now that you updated the code, I think you are falling into this problem

Answer 2

try this

this.FormGroup.patchValue({['city']: 'Atlanta'});