问题标签 [angular-forms]

我有一个这样的模板驱动表单：

我想用它来创建和编辑人员记录。如果我输入一些值并单击提交按钮f.value是这样的：

它按原样工作，但我希望我的表单模板不那么冗长。我想避免在编辑时将每个输入绑定到表单值对象的相应属性。是否可以将整个对象绑定到表单值？

我希望能够将先前检索到的对象绑定f.value到表单，但不能。

我猜这应该可行，但它没有：

这也不起作用：

实现简洁优雅的表单模板的最佳方式是什么？

假设我在 Angular 中有这个表单：

提交给 Web 服务以进行保存、更新等。Web 服务当然必须检查输入是否正确，并在出现任何问题时返回一些验证消息。假设我发布表单并在 JSON 字典中获取这些验证错误：

我不清楚角度应该如何处理这种情况。周围的大多数信息都建议编写一个自定义验证器，该验证器将对服务器进行异步验证，例如：

现在，这意味着我应该为表单中可能存在的每条数据提供一个特定的 Web 服务。虽然这在某些特定情况下可能有意义（例如唯一的电子邮件/用户名验证），但我不喜欢在我的 Web API 中填充大量只会执行验证任务的服务，然后必须在我的角项目。

我想出的一个可能的解决方案是将我的组件中的服务器错误对象保存为一个属性，然后有一个 Angular 验证器来检查特定字段是否有错误消息：

然后强制验证器使用 updateValueAndValidity 或某种东西刷新。但我觉得这不对。有没有一种“棱角分明”的方法来解决这种情况？

我将值从一个组件传递到另一个具有动态形式的组件，但在该组件中，没有接收到值。如果我在将值传递给动态表单时做错了什么，或者这不是动态表单接收值的方式，我不会得到。

我没有粘贴整个代码，否则它会太大，所以我只提到了相关的代码。如果需要进一步说明，请告诉我。

在 AdminService 中，这是服务类，其中主题定义如下：

在 ProductItemsComponent 中，值如下发送到另一个组件。

在 ItemEditComponent 中，订阅值如下

我有一个带有 selector 的自定义控件app-date-picker。它实现ControlValueAccessor. 我有一个名为的组件MyPage，其中包含此自定义表单控件，方法是：

我正在尝试编写一个单元测试来MyPage测试绑定的两个方向。我已经为其他表单字段做到了这一点，例如：

当我尝试为我的自定义表单控件执行此操作时，我的问题出现了。到目前为止，我只能测试一个绑定方向，即便如此它也需要使用ng-reflect-model，这太糟糕了：

有没有更好的方法来做到这一点？我想：

1. 能够从MyPage单元测试中测试绑定的两个方向，以便我知道我将它正确连接到表单控件
2. 不必使用ng-reflect-*

其他注意事项：

该MyPage组件是具有fromDate（和zipCode）字段的标准组件。

自定义表单字段ControlValueAccessor正确实现，有一个date字段，并在<input>内部使用一个，它本身通过以下方式绑定ngModel：

日期选择器组件

2017 年 8 月 10 日更新

到目前为止，我已经接近了我想要的@ViewChild：

MyPage模板变为（注意模板引用变量）#fromDate：

那么测试就变成了：

有人知道更好的方法吗？这让我暂时靠得住，尽管它不是最佳的。

我的 Angular 4 应用程序中存在生成表单的问题，更准确地说，是动态生成<select>其标签的标签。<option>

我在plunker中制作了我的代码的简化版本。

我遇到的问题在我选择一个不是第一个默认undefined选项的选项后立即发生：代码值设置正确，但<option>标签内的文本消失了。

我该如何解决？

我正在尝试在 Angular 4 项目中创建一个自定义验证器，它只允许输入数字以外的字符。

到目前为止，我已经尝试了多种选择，但似乎都没有奏效。

我正在做这样的事情：

零件

验证器

难道我做错了什么？谢谢

我有一个页面，您可以在其中动态添加一个表单，但我想要做的是将它们中的每一个作为不同的对象。现在，当我添加一个新表单并填写输入字段时，它也反映在其他表单中，但我希望应用程序将每个表单视为一个单独的实体。我将如何实现这一目标？我的代码如下：

HTML

Javascript

任何帮助，将不胜感激。谢谢！！

我正在尝试对“passwordConfirm”字段进行验证，但出现了一个错误：ERROR TypeError: Cannot read property 'get' of undefined 这是我的代码：

我想创建自定义验证来验证密码是否相同，但问题是自定义验证器没有触发。抱歉，我无法分享 plunkr。

//这里是注册组件（和导入）

//验证器函数

创建由以下“嵌套对象”（建筑物）组成的嵌套表单：

如您所见，Building 类包含其他类，例如 Address 和 BuildingType，它们还具有其他属性，例如 id 和 description。

创建表单时，我在组件 ts 文件中使用了以下代码：

这就是表单绑定到 HTML 模板的方式：

现在，当我输出整个表单的值时，问题就出现了，这些值并没有真正根据在 formGroup 内的嵌套字段控件中键入的内容进行更新，例如地址或 buildingType。否则正常更新。

这是输出值的方式

但是，如果 createBuildingFG 函数的执行方式不同，并且每个 formControl 都是显式创建的，而没有传递整个对象，则表单会正常运行。例子：

任何人都可以解释发生了什么？显然，为了避免执行显式定义 fromGroup 的每个元素的繁琐任务，人们可能只想传递整个对象。