使用ControlValueAccessor可插入验证器的角度自定义输入组件

时间:2020-08-12 23:56:55

标签: angular validation custom-component

我用自己的样式编写了一个自定义输入组件,并实现了ControlValueAccessor。除了验证部分,我已经完成了所有工作。我正在尝试做的是让控件的用户添加任何我们做为角输入的常规输入组件的自定义验证。例如

<input type="text" customValidator />

cutomValidator是我单独编写的自定义指令。将其插入定制输入组件的最佳方法是什么。我的理想要求是

  • 稍后应能够插入其他验证,例如<custom-comp validator1 validator2 validator3 #customComp>

  • 组件应反映验证的状态。以上面的示例customComp.errors.validator1为例,如果失败,则应返回true。

我尝试将一组对象作为@input传递到自定义组件中,但是我不确定如何传播它们并将其应用于自定义组件中的input组件。

我在自定义组件.ts文件中尝试过类似的操作

  getValidators() {
        return this.validators.join(' ');
    }

在模板{{getValidators()}}中,但是出现以下错误

Failed to execute 'setAttribute' on 'Element': '{{getValidators()}}' is not a valid attribute name.

0 个答案:

没有答案