Question

我正在尝试使用反应形式创建一个嵌套表。我想实现每个项目都有很多产品编号，因此一行中可以有多行。如何使用反应形式来实现该功能？

我将如何实现multipleProductNumber formArray？

这是我在下面尝试过的方法。这也是我指向我的stackblitz的链接

https://stackblitz.com/edit/patch-info-using-id-and-index-vbhgwx?file=app/app.component.ts

initGroup() {
    let rows = this.addForm.get('rows') as FormArray;
    rows.push(this.fb.group({
        item_id: ['', Validators.required],
        unit_price: new FormControl({ value: '', disabled: true }, Validators.required),
        multipleProductNumber: this.fb.array([
            this.fb.group({
                product_number: [''],
                date_expiration: [''],
            })
        ]),
    }))
}

Answer 1

这是UnluckyAj帖子的更正。他没有这个

removeAddress(i, j) {
    const control = <FormArray>this.myForm.get('people')['controls'][i].get('addresses');
    control.removeAt(j);

  }

检查此stackblitz链接DEMO LINK

Answer 2

听起来您正在动态生成反应式表单。

Angular网站上有一个很好的教程可以解决这个问题：

https://angular.io/guide/dynamic-form

在本教程中，使用模拟后端数据填充表单，将数据转换为表单组/控件，并进行迭代以呈现视图。您只需要在迭代以呈现行时对其进行调整即可。

使用角形中的反应形式的嵌套行

2 个答案: