FormGroup 和 FormArray 有什么区别?什么时候用什么?
What is the difference between FormGroup and FormArray? When to use what?
我的代码中有多个动态 FormGroup
。
此外,一些 FormGroup
s 具有添加多个 FormGroup
s/FormControl
s 的功能。
因此,在动态创建 FormGroup
时,我使用了 FormBuilder.group()
,但对于多个组,有一个数据数组,我想为其创建 FormControl
s。
如何为这个数据对象数组创建动态 FormControl
?
将响应式表单视为数据模型周围的表单。因此,响应式表单将完全符合您的数据模型的方式。
考虑这个 data-model 例如:
{
id: 1,
name: "Leanne Graham",
username: "Bret",
email: "Sincere@april.biz",
isVerified: false,
address: {
street: "Kulas Light",
suite: "Apt. 556",
city: "Gwenborough",
zipcode: "92998-3874",
},
phone: "1-770-736-8031 x56442",
website: "hildegard.org",
posts: [[
{
userId: 1,
id: 1,
title: "sunt aut facere repellat provident occaecati excepturi optio reprehenderit",
body: "quia et suscipit\nsuscipit recusandae consequuntur expedita et cum\nreprehenderit molestiae ut ut quas totam\nnostrum rerum est autem sunt rem eveniet architecto",
commentIds: [1, 2, 3, 4, 5]
}, {
userId: 1,
id: 2,
title: "qui est esse",
body: "est rerum tempore vitae\nsequi sint nihil reprehenderit dolor beatae ea dolores neque\nfugiat blanditiis voluptate porro vel nihil molestiae ut reiciendis\nqui aperiam non debitis possimus qui neque nisi nulla",
commentIds: [6, 7, 8, 9, 10]
}
]]
}
现在这里是 over-all 反应形式的要点 data-model。
- 如果 属性 的值是一个对象(如
address
),那么我们将为它创建一个 FormGroup
。
- 如果 属性 的值是一个数组(如
posts
),那么我们将为它创建一个 FormArray
。
- 如果 属性 的值是原始值(如
id
、name
、isVerified
等),我们将为它创建一个 FormControl。
仅此而已。都很漂亮straight-forward.
现在你可能会想:
What will you create for posts
?
What will you create for commentIds
?
所以如果你回到上面的规则:
You'll create a FormArray
of FormGroup
s for posts
.
And you'll create a FormArray
of FormControl
s for commentIds
.
这应该可以回答您的主要问题。
PS: 我们需要更多信息来帮助您获得有关如何执行您在此处尝试执行的操作的确切代码。
我的代码中有多个动态 FormGroup
。
此外,一些 FormGroup
s 具有添加多个 FormGroup
s/FormControl
s 的功能。
因此,在动态创建 FormGroup
时,我使用了 FormBuilder.group()
,但对于多个组,有一个数据数组,我想为其创建 FormControl
s。
如何为这个数据对象数组创建动态 FormControl
?
将响应式表单视为数据模型周围的表单。因此,响应式表单将完全符合您的数据模型的方式。
考虑这个 data-model 例如:
{
id: 1,
name: "Leanne Graham",
username: "Bret",
email: "Sincere@april.biz",
isVerified: false,
address: {
street: "Kulas Light",
suite: "Apt. 556",
city: "Gwenborough",
zipcode: "92998-3874",
},
phone: "1-770-736-8031 x56442",
website: "hildegard.org",
posts: [[
{
userId: 1,
id: 1,
title: "sunt aut facere repellat provident occaecati excepturi optio reprehenderit",
body: "quia et suscipit\nsuscipit recusandae consequuntur expedita et cum\nreprehenderit molestiae ut ut quas totam\nnostrum rerum est autem sunt rem eveniet architecto",
commentIds: [1, 2, 3, 4, 5]
}, {
userId: 1,
id: 2,
title: "qui est esse",
body: "est rerum tempore vitae\nsequi sint nihil reprehenderit dolor beatae ea dolores neque\nfugiat blanditiis voluptate porro vel nihil molestiae ut reiciendis\nqui aperiam non debitis possimus qui neque nisi nulla",
commentIds: [6, 7, 8, 9, 10]
}
]]
}
现在这里是 over-all 反应形式的要点 data-model。
- 如果 属性 的值是一个对象(如
address
),那么我们将为它创建一个FormGroup
。 - 如果 属性 的值是一个数组(如
posts
),那么我们将为它创建一个FormArray
。 - 如果 属性 的值是原始值(如
id
、name
、isVerified
等),我们将为它创建一个 FormControl。
仅此而已。都很漂亮straight-forward.
现在你可能会想:
What will you create for
posts
?What will you create for
commentIds
?
所以如果你回到上面的规则:
You'll create a
FormArray
ofFormGroup
s forposts
.And you'll create a
FormArray
ofFormControl
s forcommentIds
.
这应该可以回答您的主要问题。
PS: 我们需要更多信息来帮助您获得有关如何执行您在此处尝试执行的操作的确切代码。