Let's suppose that have a form, like this (my real form is more complicated):
this.group = this.formBuilder.group({
name: '',
email: ''
});
My form configuration works so far... now I'm wanting to change some values before submit the form to the API... and since I want to keep the reference and value of the original form` untouched, I prefer to clone the form. So I'm trying to do it like this:
const cloneGroup = this.formBuilder.group(this.group.controls);
// Shouldn't it create a form with a new reference,
since it creates a new FormGroup internally?
The problem is that once I call patchValue method in cloneGroup, this.group also changes, and ofc I want only the clone to be changed.
Here's the demo that you can play to see better my question.
The question is: Why? If I created a new form isn't it supposed to create a really new form?
PS: As explained above, I don't want to clone only the values because I want keep the reference and values of the original form (to call some methods of the form itself), so just cloning the value isn't an option.