Need Help with Reading Values from Repeating Control in Angular 6
I am struggling to retrieve the value of a form field in the TS file. Can someone please assist me with this?
This section contains repeating blocks where you can click "add" and it will generate another control group.
<div *ngIf="subTask.value==5 && subTask.value!=null" formArrayName="itemRows">
<div *ngFor="let itemrow of taskfrm.controls.itemRows.controls; let i=index" [formGroupName]="i">
<!-- Border START -->
<div class="add-new-task-border">
<mat-form-field class="example-full-width">
<mat-select placeholder="Logical Operator">
<ng-container *ngFor="let relationaOpt of relationalOpraters">
<mat-option *ngIf="relationaOpt.operatorsType==='logical'" [value]="relationaOpt.id">
{{relationaOpt.operator}}
</mat-option>
</ng-container>
</mat-select>
</mat-form-field>
<mat-form-field class="two-way-banding">
<mat-select placeholder="DataElement 1">
<mat-option *ngFor="let dataElement of dataElementList" [value]="dataElement.dataElementID">
{{dataElement.dataElementName}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field class="two-way-banding eta-margin-two-way">
<mat-select placeholder="Relational Operator">
<ng-container *ngFor="let relationaOpt of relationalOpraters">
<mat-option *ngIf="relationaOpt.operatorsType==='relational'" [value]="relationaOpt.id">
{{relationaOpt.operator}}
</mat-option>
</ng-container>
</mat-select>
</mat-form-field>
<mat-form-field class="two-way-banding">
<mat-select placeholder="DataElement 2">
<mat-option *ngFor="let dataElement of dataElementList" [value]="dataElement.dataElementID">
{{dataElement.dataElementName}}
</mat-option>
</mat-select>
</mat-form-field>
</div>
<!-- Border END -->
</div>
</div>
<button *ngIf="subTask.value==5 && subTask.value!=null" style="float:right;" type="button" mat-icon-button color="primary"
(click)="addNewRow()">
<mat-icon>add_circle</mat-icon>
</button>
<button *ngIf="subTask.value==5 && subTask.value!=null" style="float:right;" type="button" mat-icon-button color="primary"
(click)="addNewRow()">
<mat-icon>remove_circle</mat-icon>
</button>
If you have any insights on this matter, please share them with me.