在angular中，如何在FormArray中动态添加不同的FormGroup？
在angular中，如何在FormArray中动态添加不同的FormGroup？
提问于 2020-10-23 00:02:34
我想动态地将几个菜添加到这个订单数组中。每一道菜都是一个FormGroup。这道菜可以是披萨、沙拉、饮料或其他东西。在添加任何内容之前，表单应如下所示：
this.fb.group({
firstName: ['', Validators.required],
lastName: [''],
order: this.fb.array([])
});在添加菜肴之后，form应该是这样的：
this.fb.group({
firstName: ['', Validators.required],
lastName: [''],
order: this.fb.array([
{type:pizza, name:summerPizza, size:8},
{type:salad, name:goodsalad, size:small},
{type:pizza, name:nicePizza, size:11},
{type:drink, name:beer, brand:abc},
])
});用户可以添加任意数量的项目。那么如何做到这一点呢？
回答 1
Stack Overflow用户
发布于 2020-10-23 00:16:19
如果我正确理解了您想要的是什么，那么您可能需要一个返回想要添加到formArray的formGroup的方法。
假设这是在组件类上下文中。
在.ts中：
formGroup = this.fb.group({
firstName: ['', Validators.required],
lastName: [''],
order: this.fb.array([])
});createOrder(): FormGroup {
return this.fb.group({
type: this.fb.control(""),
name: this.fb.control(""),
size: this.fb.control(""),
brand: this.fb.control(""),
});
}然后，您将拥有一个调用该createOrder并将formGroup添加到formArray的方法
get ordersFormArray(): FormArray {
return this.formGroup.get('orders') as FormArray;
}addOrder() {
this.ordersFromArray.push(this.createOrder())
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/64486125
复制相关文章
相似问题
腾讯云开发者
