Getting Unique Formcontrol Values For Duplicated Formfields Angular

Introduction: I have a reactiveform. It contains two form fields named name and value. So I have a add button which duplicates the form. So if I click it the form fields name and v

Solution 1:

Create a variable of type FormGroup as your form contains a FormArray. It will hold the currently selected form. In your button click pass the current form as argument to your show method.

<button (click)="openForm(form)">Show</button>
 
openForm(form: FormGroup) {
     this.selectedFormGroup = form;
}

In your template you get show the selected form value like this.

<div *ngIf="selectedFormGroup">
    {{selectedFormGroup.value | json}}
</div>

Working CodeSandBox

https://codesandbox.io/s/formarraydynamic-rqdhc?file=/src/app/app.component.html