问题标签 [formgroups]

我试图在不使用 formArray 的情况下在另一个 formGroup 中动态添加 formGroup。并且还在新添加的formGroup中动态添加formControl。我也尝试过 addFormGroup() 函数，但它给出的错误是 this.form.addFormGroup 不是函数。

我在 Angular 7 中使用响应式。我正在为用户配置文件编辑创建子组件。我有多个角色明智的用户页面。在所有这些页面中，用户个人资料字段都很常见。所以我创建了用户配置文件组件，其中有一个输入参数 FormGroup：

现在我想扩展输入 FromGroup 以添加用户配置文件字段。例如，我想从我的子组件扩展/添加传入/输入 FormGroup，如下所示：

谁能建议我该怎么做？

我的子组件中有 20 多个字段。所以我不想一一添加FormControl。有没有办法在现有的表单组中扩展 JSON 如下

我正在尝试在单元格内编辑剑道网格元素。

我有一个剑道网格，其列定义如下：

我按照此链接的第一个示例来实现单元内编辑表单：https ://www.telerik.com/kendo-angular-ui/components/grid/editing/in-cell-editing/

在此行中定义表单组：

一切都适用于 ID 字段和每个“一级”字段。我无法在附加信息宽度等网格嵌套元素上进行编辑。

我不能补充说，这似乎只是“表单位置”的问题，因为通过一些警告，我了解到“单元格编辑”从单击开始，然后在远离列的位置单击结束。

我什么都试过了。有什么建议吗？谢谢！

我想问一下为什么表单组指令不区分大小写？在构造函数中，它的写为“FormGroup”（以及初始化），而在 html 标签指令中写为“formGroup”，我想知道这是否是一个错误，或者它可能是有意的。

谢谢

代码参考：构造函数

HTML 标记指令

<form [formGroup]="service.form" class="normal-form">

我希望在构造和 html 标记指令之间具有相同的“FormGroup”一致性

太感谢了

ReactiveForm我正在尝试Angular使用此数据层次结构创建一个：

我创建了一个组件CompanyDetailsComponent和另一个EmployeeDetailsComponent

我想重用EmployeeDetailsComponentwith formGroupNames employee1 & employee2

这是代码堆栈闪电战

实际上我想让它适用于可变数量的员工我必须保持结构平坦（我不能使用员工数组，在这种情况下我会使用FormArray这样的）

因此，为了实现这种扁平的层次结构，我首先尝试为 2 名员工做这件事。

任何帮助将不胜感激

先感谢您！

我正在使用 Angular 6。我有一个学生注册表。字段：姓名、地址、电话、批次。

在后端，我有一个学生表和另一个批处理表（它有自己的属性，例如：id、name、schedule...）。

现在，在学生注册表单 UI 中，我需要显示批次（名称）的单个选择下拉列表。但是在保存时，我应该将 id 保存在学生表中。

formGroup.value 的当前输出：{ name:"john", address: "12 Main St", phone: "22421231234", batch: "Batch 1" }

相反，我需要，{名称：“john”，地址：“12 Main St”，电话：“22421231234”，批次：“id#”}

我知道两种解决方案，一种我可以在不使用表单组的情况下手动创建 json，我可以拥有一个模型并在用户输入时不断更新值。其次，我可以用 id 替换批次。（如果我在我的数组中使用名称进行搜索，这将不可靠，因为我的数组可能有多个具有相同名称的项目）

还有其他简单的解决方案来管理这个吗？

我有一个 FormGroup，其中初始数据可能为空，也可能不为空。如果它为空，FormGroup 的构建方式如下：

如果它不为空，它将像这样构建：

如果我尝试将 的值设置data为 null （如果它最初不是 null），就会出现问题。

我在这里设置了一个 stackblitz来演示这个问题。错误是：

无法将 null 转换为对象

基本上，问题是：一旦将属性设置为FormGroup，您如何将其设置为null？

我正在使用Angular 7和Angular Material实现注册页面。在这个页面中，我使用了一个密码输入组件，它获取对所用 FormGroup 的引用。外部组件处理逻辑部分（例如 FormGroup 的外观、FormControl 的定义方式以及每个输入的验证方式）。当我单击密码输入并单击其他位置/输入任何无效内容时，输入的错误消息将正确显示。但是当我点击提交按钮而不触摸任何输入字段时，FormGroup 的 FormControl 被验证（FormControl 甚至说它有错误）但没有被触摸，因此没有显示错误消息。

我已经查找了如何解决这种行为。一些人建议在单击提交按钮后手动将所有表单控件设置为触摸。是的，这行得通，但我想有一个通用的解决方案，所以我不必为将来的每一种表格都这样做。

注册组件.ts：

signup.component.html：

app-base-password-input.component.ts：

app-base-password-input.component.html:

我
的期望：当我单击提交按钮而不触摸/单击任何输入字段时，每个输入都会显示一条错误消息（嘿，用户！我是必需的！）。

实际发生
的情况：当我单击提交按钮而不触摸/单击任何输入字段时，只有外部组件中定义的 FormControls 显示错误消息（本例：联系复选框）。我的输入组件没有显示错误消息（本例：密码组件）。

我希望我发布了您回答我的问题所需的一切。如果还有不清楚的地方，我会更新帖子:)

如果我想将一个复制formgroup到另一个，最好的选择是什么？

例如，如果消息是我的formgroup，它具有需要复制到与fromgroup消息具有相似结构的 pageForm 的小部件数组。

我试过了：

(<FormArray>this.pageForm.get('widgets')).push(<FormArray>this.message.get('widgets'))

我试图弄清楚如何为selectformArrayName 内部设置绑定对象复杂绑定。我猜测 formControlName 应该引用数组中的当前项，但我不知道如何访问它。

我已经创建了带有单选（按我想要的方式工作）和将值推入“id”的数组的演示。 https://stackblitz.com/edit/angular-d2uaa1

任何帮助是极大的赞赏。

编辑

关键点：

• UsersGroup使用所有属性（id 和登录名）绑定整个对象
• 最低附加代码 (KISS)

解决方案（基于@JT_82 评论）