问题标签 [angular-forms]

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 回答
489 浏览

angular2-forms - 添加角度表单控件值在 html 中

输出:10+10=1010

预期结果:10+10=20

0 投票
1 回答
1462 浏览

angularjs - 如何在 AngularJS 中显示提交错误并在不禁用提交按钮的情况下停止提交表单?

我想验证我的表单是否有提交空字段的错误我应该在我的控制器中做什么?

它显示了第一个错误,但没有显示 $submitted 的错误

我为什么要在这里做?

0 投票
2 回答
7774 浏览

javascript - FormGroup 中的 Angular 2/4 FormControl 无法在带有标签的表单上显示

我不明白该怎么做

  1. 特定值的 console.log
  2. 在 HTML 页面的标签中显示
  3. 在输入文本中显示

这是我的组件打字稿,带有新的 FormGroup,然后是新的 FormControls

页面上的 HTML -

0 投票
1 回答
2152 浏览

javascript - Angular 2使表单无效

我有以下示例代码:

组件.html

组件.ts

所以基本上我检查文本字段上的输入是否是有效的json表达式。如果我发现错误,我想让表单无效。

有没有办法做到这一点?

0 投票
2 回答
54 浏览

forms - 如何压缩在 Angular 的 ReactiveFormsModule 中定义验证器和验证器列表的代码?

我有基于ReactiveFormsModule的表单验证,如下所示。实际上,还有很多验证器,并且每个验证器的列表更长(尽管每个验证器基本相同)。

它是如此冗长,这让我很困扰,我想知道是否有一种巧妙的方法可以将所有验证器粉碎在一起,并以某种方式让它有一个单一的实例。

0 投票
2 回答
659 浏览

angular - Angular 表单:如果单个值发生更改,则验证完整的表单组

是否可以将单个验证器添加到 formGroup,只要 formGroup 中的单个值发生更改,就会调用该验证器?

我认为它应该是这样的:

但是不会在 formGroup 内部发生的更改时调用验证器,...我可以将验证器单独添加到每个字段,然后调用control.parent(正在工作),但这似乎不是一个合适的解决方案。

0 投票
1 回答
164 浏览

javascript - Angular 表单中的组验证与控件验证

我的 Angular 表单中有一个表单组。我想将自定义“黑名单”验证器应用于整个组,而不是每个字段。

是否有适当的方法来检查每个字段是否通过验证器而不将其应用于每个控制器?我想这将是验证组而不是分别验证每个字段。那可能吗?

现在我正在做:

但是我遇到了错误。大概是因为我拥有的黑名单验证器不是针对一个组,而是一个控件。我应该专注于更改验证器以检查表单中的每个控件还是进行不同的组验证?

这是我构建的验证器:

0 投票
2 回答
1036 浏览

angular - Angular 中的互斥选项

让我试着解释一下我的情况......

我有一个<form>包含一个FormArray. 每个FormArray组都有“食物” control,每个组都是一个<select>

所有选择都由一个 array.

我想要实现的是:

每个 select 的选项必须被排他地选择......换句话说,结果FormArray必须只包含唯一元素。


我的实际代码:

HTML:

零件:


我想知道实现这一目标的最佳选择。

到目前为止,我认为有 3 个选项:

1 - 禁用已经在另一个中选择的选项<select>

2 - 创建一个自定义验证器并告诉用户他不能在 2 个或更多选择中选择一个选项。

3 -从其他选择中完全删除选定的选项。

我更喜欢第一个。选项,但是我找不到这样做的方法。有人可以告诉我一些开始吗?我希望这个问题足够清楚。

这是一个演示

0 投票
1 回答
1242 浏览

angular - 验证输入值的指令

我创建了用于验证输入值的指令。我需要在输入一些字符时,我的输入/表单变得有效。这是我的代码,但它不起作用。

谢谢您的帮助。祝你今天过得愉快。

0 投票
1 回答
100 浏览

angular - 表单失败的角度端到端组件测试

我有一个简单的 Angular 表单,想通过端到端测试对其进行测试。即我想从 UI 驱动测试。我写的测试没有像我预期的那样工作。

零件:

考试:

测试失败:Expected false to be truthy.。尽管我事先进行了调试,但该12345值并未显示为我调试此部分时的值。component.form.controls.foo.valuefixture.detectChanges()

我究竟做错了什么?

这是一个plnkr