问题标签 [angular-forms]

Angular 自定义表单组件/指令和 $dirty 属性

使用常规输入时，例如

在输入框中输入后myForm.$dirty为真。

我想创建一个简单的指令，例如

示例用法将是

并在用户单击两个按钮中的任何一个后，myForm$dirty设置为 true。

这是如何实现的？

我正在按照 Asim Hussain 先生的书中的说明操作并遇到控制台错误。作为对自己的挑战，我没有像作者在他的示例中使用的那样使用 plunker，而是使用 angular cli 来模拟更现实的开发场景，但我遇到了以下错误：

这是他在 plunker 上的示例的链接：http ://plnkr.co/edit/MyHYNKJiB5ruiH1AOauL?p=preview

这是我的组件

模型.form.component.ts

app.component.ts

app.module.ts

这只是讲座的恳求，我相信还有更多要让表单正常工作，而表单加载并且应用程序不会完全崩溃，在他的 plunker 中没有错误，所以问题是，为什么我收到错误了吗？提前谢谢你。

我正在寻找通过单个复选框提交多个值的最佳方式。这些值正在保存在服务中。

使用属性语法，我可以绑定到一个附加data-*属性。有没有办法合并自定义data-*和value属性的值以在“提交”时一起发送，或者是否应该使用该getAttribute()方法以不同的方式处理？

模板

零件

编辑：为清楚起见，我想提交/保存分配给单个复选框的多个值。这些是分配给 HTML 中的 'value' 属性和 data-stock-sku/attr.data-stock-sku 属性的值。但是，在提交时，默认情况下，Angular 仅通过分配给“值”属性的值发送。

我正在使用 angular 2 形式在我的应用程序中填充和编辑信息。当涉及到后端数据模式的图像时，它看起来像这样：

但是现在它已更改为如下所示：

]

我当前的 form.ts 处理图像是这样的：

处理图像渲染和编辑的 form.html 部分如下所示：

我不明白的是把 Media 当作一个数组来处理，它仍然可以被拉入我的 form.html 并能够显示我想要的图像。旧模型允许调用 img1/img2/etc。但是作为数组的新模型在包含 Url 和其他字段的对象之外没有任何对象。我知道我可以创建一个带有 formGroup 和一些 formControls 的 formArray 来获得正确的结构，但是能够在 html 上正确获取这些图像给我带来了麻烦。

任何帮助/建议/提示将不胜感激。

I have an Angular (4) application that generates a formGroup object in my application component. I want to dynamically add all these components in my template, it expected the following to work.

But that generates the following error:

Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays.

Is it even possible to achieve this in Angular?

我在组件而不是 html 中设置自定义验证错误消息。我无法获得像错误消息对象这样的全局变量，因为表单没有被初始化。获取未定义的错误消息...

零件

当我在组件的 ngOnInit 函数内调用this.employeeForm.disable()时，我的所有表单控件都被禁用，除了提醒电子邮件，单选按钮控件。如果我将禁用调用放在甚至 1 毫秒的 setTimeout 内，它就可以工作。（整个表单被禁用）我什至可以通过在页面上的某处放置一个单击处理程序来在启用和禁用之间切换控件来使其工作。我可以应用许多技巧来使其工作，但我更愿意以正确的方式做到这一点。如果您需要更多信息，请在评论中问我。

组件.ts

html

为什么当我单击一行的编辑按钮时，模态会意外打开？就像 - 可以打开几行，然后其他行不会。或者当我尝试单击那些未打开的行时，它们已经可以令人惊讶地打开了。完全不可预测。

这是我的代码：

部分列表：

对话形式：

（我认为不需要 HTML，因为我只想知道为什么单击上面的编辑图标/按钮后模态的显示是不可预测的）

我有什么

• 显示来自 firebase 列表的项目的项目列表（此信息是从引用 firebase 中的节点的项目列表服务中提取的）
• 添加新项目的表单 - 这允许我将新数据写入 firebase。网址如下所示：url.com/projects/0/edit
• 当我点击一个项目时，它会将我带到一个项目详细信息页面，其中附加了 url ( url.com/projects/-key123456 ) (这引用了一个引用不同 firebase 节点的不同服务)
• 在项目详细信息页面上，我有一个编辑按钮。单击此网址时，网址如下所示：url.com/projects/-key123456/edit
• 总而言之，添加新项目很好。后面我会写编辑方法。我只需要知道如何根据所选项目预填充表单

我不知道如何实现

• 我将如何根据所选项目预先填充我的编辑表单输入字段？

项目编辑组件.html

项目编辑组件.ts

任何帮助将不胜感激。

编辑：下面是基于@msmolcic 的进度的编辑！

项目编辑组件.ts

项目解析器.ts

我以前从未创建过其中的一个，所以请原谅任何愚蠢（我只学习了一个半星期的角度）。如果我注释掉我的返回数据，页面就会加载并且我可以导航。当我包含返回行时，我的分页符没有错误。

路由

项目编辑 HTML

感谢您继续努力。现在感觉更近了！:)

假设模板有这样的代码片段：

该组件具有以下内容：

validate() 由其他一些动作调用，旨在以编程方式触发表单验证。

但是，在控制台日志中，显示 addressCtrl 无效，而 myForm 仍然有效。

如果任何子控件无效，任何人都知道如何将 myForm 状态更新为无效？

谢谢！