问题标签 [formgroups]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
212 浏览

html - 使用 Angular 在选择框中绑定表单组

我有一个嵌套的 JSON 数组,我必须使用 formgroup 或 formarray 迭代到 HTML。此响应将根据数组的长度迭代到动态创建的选择框中。传入的 JSON 响应是:

我必须以这样的方式将其迭代到 HTML 中,如果这些选项中的任何一个具有toBeSelectedas true,则应在 HTML 中预先选择该选项,如果没有,则可以显示占位符文本。

0 投票
2 回答
401 浏览

html - 如何从角度设置表单组数据

我有一个如下的表单组:

我能够使用 formgroup setValue 设置数据,但在呈现 HTML 中的值时,未选择该选项。这是 HTML:

这不会选择 HTML 中的第一个输入标签,但在打字稿中表单是有效的。

0 投票
0 回答
48 浏览

html - 使用表单组为 HTML 设置选择值

在 Json Data 的基础上,我必须迭代一系列单选按钮,其中只能选择一个。

JSONDATA = Observable.of({ items: [ itemId:1, itemId:2, itemId:3 ]})

Formgroup 如下所示,由用户选择的 itemId 组成:

迭代的 HTML 如下:

在特定场景中,如果 json 数据中只有一个 itemId,则必须预先选择单选按钮,并且表单应自动设置为该值,并且表单将变为 VALID。

我能够使用 formgroup setValue 设置数据:

但在这种情况下,表单状态更改为有效,但在 HTML 中,未选中单选按钮。所以我试图通过将选中的附加到单选按钮来实现这一点

但这也给模板解析带来了错误。

所以基本上我希望如果数组只有一项,则预选单选按钮。

0 投票
0 回答
30 浏览

angular - 如何创建嵌套的 formGroup 并在 Angular 中访问其属性

我正在尝试创建一个动态添加更多 formGroups 的 formGroup,其中 2 个属性集之一是数组。这是我想要的输出

这就是我在我的 ts 文件中为动态创建 formGroup 所做的:

这是html文件:

我似乎无法让它工作,至少无法创建新的 FormGroup。我在控制台中收到此错误:

谢谢你们的帮助。

0 投票
1 回答
715 浏览

angular - 如何在 Angular 中为包含 FormArray 的 FormGroup 设置值

如果我有一些数据,数据结构如下:

现在我有一些这样的项目数据:

也许这种方式很有用:

有没有什么优雅的方法可以用 FormArray 构建一个 FormGroup 并将这些数据设置为表单?

0 投票
1 回答
223 浏览

angular - 如何使用 Angular 6 反应式表单绑定来绑定以下 HTML 标记?

我正在处理 Angular 表单,请找到这个工作示例

我需要将此表单绑定到表单组和表单数组并取出模型并发送数据库以保存更改。我遇到了问题,当相同的数据类型出现不止一次时,下拉框的更改会影响两个控件。

0 投票
1 回答
431 浏览

angular - Angular:复选框的表单组绑定在迁移到版本 6 后未设置默认值

我有一个使用 angular2/3/4 构建的应用程序。我有一个控制器,它FormGroup使用如下所示的代码初始化一个(初始化在其构造函数中完成):

这是其中一个复选框的 HTML:

迁移到版本 6 后,我注意到如果用户没有“选中/取消选中”与组成组的每个表单控件关联的复选框,那么尝试获取其值将返回 null(而不是默认值) :

我知道我已经有几个月没有真正活跃在 Angular 中了,但我的印象是,group在组设置期间传递给方法的默认值应该用作用户没有触摸时的值复选框。我错了吗?上一个版本的发布有什么变化吗?

谢谢。

0 投票
2 回答
3747 浏览

typescript - Angular6 - 使用名称获取嵌套的 FormGroup

我有嵌套表单组

我想找到嵌套的表单组,即“com.complex.Address”。

我已经试过了

但它总是返回 Null 值。

现在,如果我将嵌套的表单组(即'com.complex.Address')更改为任何其他名称,如“test”并执行this.form.get('address').get('test');它实际上返回我想要的值。

但关键是我不能更改嵌套名称,它会包含一些特殊字符。

如何转义字符并根据需要使用表单组。?

0 投票
1 回答
1743 浏览

angular - 将值分配回组的角度 PatchValue 问题

我遇到了一个问题,我试图为表单组中的一个控件修补值。它永远不会成功。我将 Angular Material DatePicker 与 moment.js 一起使用

这是HTML:

这是我调用的函数(focusout)

}

此功能用于将正确的日期格式自动分配回输入字段(图像有许多具有不同名称的日期选择器,例如 startDate、endDate 等)。例如,我在输入框中输入 25111988,当我聚焦时,输入值变为 '25/11/1988'。但问题是 control.value 永远不会修补正确显示“startDate”的键。

但是,如果我将其更改为此并且它可以工作:

这里还有一个问题是:

如果我将 group.patchValue({startDate : control.value }) 放入:

})

然后它不起作用。这就是为什么我把这个补丁函数放在forEach之外。

需要帮忙。非常感谢。

0 投票
0 回答
503 浏览

angular - 错误:mat-table 上的 FormArray --> 找不到路径控件(Angular 6)

这是我的html:

这是我的 ts:

我从调试器返回的错误是:错误:找不到带有路径的控件:'taskDetails -> action'

我应该如何设置正确的路径?

我从这里有这个例子:https ://stackoverflow.com/a/45155324/5545770 --> 它基于“普通”,但它也应该在mat-table上工作,对吧?

[更新] 我只是在错误的标签上设置了formGroupName

因为它是:

它应该是: