Angular 无法以角度访问formArray的值

我无法在我的角度项目中使用被动形式访问formarray值

我的回答是这样的：

{出现一次：“初始值” formArray:数组[0]}

在表单数组中键入值并提交表单后，我仍然得到数组0

我正在分享我的代码，它存在于slack blitz链接中

代码：

TS:

inputArray:any=[]；
myForm:FormGroup；
构造函数（私有fb:FormBuilder）{}
ngOnInit（）：void{
让newForm=this.fb.group({
出现一次：['InitialValue'，[Validators.required，Validators.maxLength（25）]，
formArray:this.fb.array（[]）
});
const arrayControl=newForm.controls['formArray']；
this.inputArray.forEach（项=>{
让newGroup=this.fb.group({
物业名称：['']，
物业二：['']
});
arrayControl.push（新组）；
});
this.myForm=newForm；
}
addInput（）：void{
const arrayControl=this.myForm.controls['formArray']；
让newGroup=this.fb.group({
propertyOne:['InitialValue']，
propertyTwo:['InitialValue']
});
arrayControl.push（新组）；
}
输出（索引：编号）：无效{
const arrayControl=this.myForm.controls['formArray']；
阵列控制移除（索引）；
}
onSubmit（）：void{
log（this.myForm.value）；
}

html:

<form [formGroup]="myForm" (ngSubmit)="onSubmit()" novalidate>
    <label>Appears Once:</label>
    <input type="text" formControlName="appearsOnce" />






    <div formArrayName="formArray">
        <div *ngFor="let control of myForm.controls['formArray'].controls; let i = index">
            <button type="button" (click)="delInput(i)">Delete</button>
            <!-- <my-form-sub-component [myForm]="myForm.controls.formArray.controls[i]"></my-form-sub-component> -->
            <div [formGroup]="newGroup">
    <label>Property One: </label>
    <input type="text" formControlName="propertyOne"/>

    <label >Property Two: </label>
    <input type="number" formControlName="propertyTwo"/>
</div>
        </div>
    </div>
    <button type="button" (click)="addInput()">Add + </button>
    <button type="submit" class='btn' [disabled]="!myForm.valid">Submit</button>
</form>

出现一次：
删去
物业一：
物业二：
加上
提交

FormArray是基于索引的。所以您必须像下面这样将索引传递给formGroupName指令

component.html

<form [formGroup]="myForm" (ngSubmit)="onSubmit()" novalidate>
    <label>Appears Once:</label>
    <input type="text" formControlName="appearsOnce" />
    <div formArrayName="formArray">
        <div *ngFor="let control of myForm.get('formArray').controls; let i = index">
            <button type="button" (click)="delInput(i)">Delete</button>
            <div [formGroupName]="i">
                <label>Property One: </label>
                <input type="text" formControlName="propertyOne"/>

                <label >Property Two: </label>
                <input type="number" formControlName="propertyTwo"/>
</div>
            </div>
        </div>
        <button type="button" (click)="addInput()">Add + </button>
        <button type="submit" class='btn' [disabled]="!myForm.valid">Submit</button>
</form>

出现一次：
删去
物业一：
物业二：
加上
提交

<form [formGroup]="myForm" (ngSubmit)="onSubmit()" novalidate>
    <label>Appears Once:</label>
    <input type="text" formControlName="appearsOnce" />
    <div formArrayName="formArray">
        <div *ngFor="let control of myForm.get('formArray').controls; let i = index">
            <button type="button" (click)="delInput(i)">Delete</button>
            <div [formGroupName]="i">
                <label>Property One: </label>
                <input type="text" formControlName="propertyOne"/>

                <label >Property Two: </label>
                <input type="number" formControlName="propertyTwo"/>
</div>
            </div>
        </div>
        <button type="button" (click)="addInput()">Add + </button>
        <button type="submit" class='btn' [disabled]="!myForm.valid">Submit</button>
</form>