如何引用嵌套FormGroup中的FormArray?

时间:2019-05-13 15:54:46

标签: angular typescript

我有一个嵌套在另一个FormGroup中的FormGroup,该FormGroup中包含一个FormArray,并且我想将此FormArray绑定到我的HTML代码中。

如果我没有将FormArray嵌套在另一个FormGroup中,则它的工作原理类似于charm,但是一旦获得另一个父项,它就会中断。绑定不适用于点表示法。

我组件的代码如下:

this.fb.group({
    outerprop1: ['', Validators.required],
    data: this.fb.group({
        prop1: [''],
        fileList: this.fb.array([this.createFile()]),
        prop2: [''],
    })
});
/***/
get fileList(): FormArray {
     return <FormArray>this.form.get('data.fileList');
}
/***/
createFile(): FormGroup {
    return this.fb.group({
        id: ['', Validators.required],
        documentType: ['', Validators.required]
    });
}

createfile()方法仅返回一个FormGroup。

    <div formArrayName="fileList"
        *ngFor="let item of fileList.controls; let i = index;">
        <div [formGroupName]="i" class="file">
            <app-file-upload-with-description [formControl]="item.get('id')">
            </app-file-upload-with-description>
            <app-dropdown-input [formControl]="item.get('documentType')">
            </app-dropdown-input>
            <button class="delete-button" (click)="removeFile(i)"><i class="fas fa-times"></i></button>
        </div>
    </div>

我想成功绑定,目前我运行在一个未捕获的错误中:找不到名称为'fileList'的控件

0 个答案:

没有答案