问题标签 [angular-custom-validators]

我在 Angular 中有一个使用反应式表单的联系表单。表单包含firstName和lastName的数组address。每个地址表单组都包含一个复选框，如果选中该复选框，则需要验证 State 文本框，以及最小和最大字符长度。

我编写了一个自定义验证器，即“ stateValidator”，我试图获取兄弟元素“ isMandatory”，但我无法获得控制权。

我尝试了以下方法

• control.root.get('isMandatory');- 它的回归null
• control.parent.get('isMandatory');- 它的抛出异常

我在 stackoverflow 中找到了一些链接，但没有可用的答案，并且一些答案没有给出解决方案，例如上面的代码：control.root.get('isMandatory');我从其中一个视频教程中得到了这个，但没有任何效果。

StackBlitz 中提供了完整的工作源代码：https ://stackblitz.com/edit/angular-custom-validators-in-dynamic-formarray

app.component.ts

app.component.html

请帮助我如何在自定义验证器方法中获取兄弟抽象控件。

我尝试了以下几个答案中指定的代码

它抛出一个错误ERROR Error: too much recursion。请帮助我如何解决这个问题。

请在 此处参考 stackblitz 中的项目。

可以看出，我有控件的反应形式firstNumber，secondNumber和thirdNumber。我需要对表单控件进行验证thirdNumber，使其值不应大于在firstNumber和之间具有最小值的表单控件的值secondNumber。

validateThirdNumber每当表单控件更改时，组件中的自定义验证器都可以正常工作thirdNumber，但是我需要对表单控件的更改进行验证，firstNumber因为secondNumber验证逻辑可以根据表单控件的更改 firstNumber和secondNumber.

为此，我添加了一个更改表单控件的事件，firstNumber并且secondNumber我将表单控件标记thirdNumber为touched但似乎没有触发其验证。

那么，如何对表单控件thirdNumber的更改和表单控件firstNumber进行验证secondNumber？

此外，即使在绑定到其this.myFormGroup表单控件声明并app.componen.ts在?line:22thisthis.myFormGroupconstructor

我正在尝试将自定义验证器添加到我的 component.ts

自定义验证器文件：

组件.ts

组件.html

通过使用上面的代码，我得到以下错误

我需要一些帮助来解决这个问题，以及如何访问 custom.validator 文件中的 staffForm，因为它返回 null。谢谢你。

我为使用ngModel. 我观察到自定义验证器函数在ngModel绑定值更改之前被触发。

我已经ngModel使用断点检查了绑定变量的值，但它仍未更新，并且在更新之前执行了自定义验证器函数。

我是 Angular 的新手，谁能告诉我为什么在取消选中复选框设置绑定变量之前执行自定义验证器函数，从而产生意外结果。

我在复选框上绑定了自定义验证器，并观察到自定义验证器在初始页面加载时被调用了两次，这导致了问题，因为我的验证器用于计算选中的复选框的数量，因为它被调用了两次，所以计数器值不正确。

我在自定义验证器功能中添加了控制台日志并检查，它被调用了两次。

}

自定义验证器函数应该被调用一次，它被调用两次，我想防止它在页面加载时只调用一次。

我在 ionic4 中创建了一个注册表单，其中包含名字、姓氏、电子邮件、密码和确认密码等字段。

我还添加了验证，例如如果用户离开或触摸相应的字段，则显示这些字段是必需的。

我想为密码添加验证并确认密码。即如果密码和确认密码不匹配错误。

下面是我的代码：

.html 文件：

.ts 文件：

如果输入的密码不匹配，请帮助我如何添加密码验证和确认密码。

在实现我的代码时，我在控制台中遇到以下错误

错误：在 FormGroupDirective.push../node_modules/@angular/forms/fesm5/forms.js.FormGroupDirective 的 setUpControl (forms.js:1640) 的 _throwError (forms.js:1732) 找不到名称为“密码”的控件.addControl (forms.js:4454) 在 FormControlName.push../node_modules/@angular/forms/fesm5/forms.js.FormControlName._setUpControl (forms.js:4959) 在 FormControlName.push../node_modules/@angular /forms/fesm5/forms.js.FormControlName.ngOnChanges (forms.js:4909) 在 checkAndUpdateDirectiveInline (core.js:9244) 在 checkAndUpdateNodeInline (core.js:10512) 在 checkAndUpdateNode (core.js:10474) 在 debugCheckAndUpdateNode (core .js:11107) 在 debugCheckDirectivesFn (core.js:1106

我试图通过分组密码和重新密码控制来创建一个新的表单组，但它对我不起作用。

添加组织.ts

添加组织.html

如果密码和 rePassword 不一样，我希望输出显示错误消息，否则不

我有多个输入字段，需要几乎相同的验证。有什么方法可以减少显示错误的重复 HTML 代码。

我的代码如下

除了输入字段和强制 div 标记外，所有其他验证器 html 代码都针对每个输入字段重复。有没有办法可以在指令中返回错误消息模板。而不仅仅是空

我正在为我的组件实现 ControlValueAccessor，并且我在表单中有许多可以更改的日期范围。

我创建了一个自定义验证器，用于检查日期范围之间的任何重叠：

test.component.html

测试组件.ts

dateRange.validator.directive.ts

验证逻辑工作正常，但有效性是根据之前的表单值反映的。例如，如果我输入了重叠的值，表格保持有效，然后我删除了重叠，表格将变为无效。即使验证器正在接收最新的值。知道为什么它不能立即反映正确的有效性吗？

当我实际进行异步调用时，我的异步验证器不工作（但当我用 . 模拟它时工作Observable.of(result)。html看起来像这样：

有问题的验证器是appDuplicateEmailValidator.

验证代码如下所示：

一个重要的注意事项是，当我取消注释时// return observableOf({ 'isDuplicateEmail': true });，一切都按预期工作。但是您看到上面的代码的方式，它不起作用，即使 observable 返回正确的值（将其记录为使用过的调试器）。“它不起作用”是指表单控件永远不会进入错误状态，如下所示：

为什么以及如何解决它？