表单数组未保存输入

Question

我有这个表单数组：

this.chavesNfeForm = new FormArray([
new FormGroup({
chave: new FormControl(""),
})
]);

我在我的应用程序中使用如下：

<form [formGroup]="chavesNfeForm" *ngIf="this.nfReferenciadaForm.value.referenciada==1" >
<ng-container *ngFor="let chaves of chavesNfeForm.controls; let i = index">
<div class="row">
<div class="col-8">
<mat-form-field>
<mat-label><i class="fas fa-key"></i> Chave NF-e </mat-label>
<input matInput required formcontrolName="chave">
</mat-form-field>
</div>
</div>
</ng-container>
</form>

这样我就可以根据需要拥有多个和普通的表单，让用户可以根据需要添加或删除任何内容。

然而，当我试图输出表单的值供以后使用时，我一无所获，表单上没有存储任何值

我不知道我在这里做错了什么。(目前使用Angular 8和Typescript(

Answer 1

尝试使用formControl而不是formcontrolName

// With form control
<form
[formGroup]="chavesNfeForm"
*ngIf="this.nfReferenciadaForm.value.referenciada == 1"
>
<ng-container *ngFor="let chaves of chavesNfeForm.controls; let i = index">
<div class="row">
<div class="col-8">
<mat-form-field>
<mat-label><i class="fas fa-key"></i> Chave NF-e </mat-label>
<input matInput required [formControl]="chaves.get('chave')" />
</mat-form-field>
</div>
</div>
</ng-container>
</form>