将预定义的验证器添加到Angular中的自定义组件

我正在开发一个自定义组件，用于Angular中的表单。我正在实现

ControlValueAccessor

接口，它工作得很好

但是，我的组件没有理由在没有

required

validator（它是一个验证码）的情况下使用，因此组件的所有调用都必须指定

required

validator

是否有可能以某种方式将此验证器嵌入到我的组件中，以便在与

ngModel

和表单（基于模板和反应式表单）一起使用时始终应用于它

---

澄清。考虑这个例子：

上述

MyCaptcha

组件的所有调用都必须使用

required

属性，以便将所需的验证器应用于表单控件

是否可以在不显式指定

required

属性的情况下调用我的自定义控制器，但仍然对其应用了验证器？像这样：

组件的所有调用都必须指定required 验证器

这引发了使用和

抽象类

和

扩展它的想法

因此，将
required
验证器嵌入到所有表单组件的方法可以是这样的：

export abstract class FormValidationClass implements ControlValueAccessor {
     // Implement your validation methods for your standard form including required validator

    protected formModel:<any>;        

    protected constructor() {
    }

    public requiredValidatorMethod() { 
        // Do stuff here with formModel, for example 
    }
}

导出抽象类FormValidationClass实现ControlValueAccessor{
//实现标准表单的验证方法，包括所需的验证器
保护模式：；
受保护的构造函数（）{
}
public requiredValidatorMethod（）{
//例如，在这里使用formModel进行操作
}
}

并且，您实际创建的组件将有一个表单：

export class UserFilter extends FormValidationClass implements OnInit {

      protected formModel:<any>;

      this.requiredValidatorMethod (this.formModel);
}

导出类UserFilter扩展FormValidationClass实现OnInit{
保护模式：；
this.requiredValidator方法（this.formModel）；
}

因此，只要您的类声明
受保护的formModel
和
扩展FormValidationClass
，您就可以使用
FormValidationClass
中的方法，并且避免每次为具有表单的每个组件添加特定逻辑

这将是我将逻辑嵌入到包含表单的所有组件的方式，在本例中，将
required
验证器嵌入到包含需要验证的表单的所有组件中

希望它有帮助，或者至少是有用的！让我知道进展如何

干杯
 对不起，我有点不专注，但是，对于必需的验证器，您是什么意思？您的意思是
必需的
属性？是的，我的意思是必须提供组件的值，否则它将被视为无效。Angular在基于模板的表单中使用
required
属性来解决这个问题。我目前的情况与此类似。是否可以选择使用反应形式？到目前为止，我发现的所有可能有帮助的方法都是用反应式表单完成的。我认为解决方案应该是反应式表单和模板表单之间的交叉兼容。感谢您花时间编写答案，但是，我认为您误解了我的问题。我已经澄清了一点。我说的不是重用组件来定义另一个组件，而是将验证器添加到组件本身，而不是它的调用。我所说的调用是指它在模板中的单一用法。对，我想我理解了。看看这个：在代码中进行验证，不需要属性
required
（他保留它是为了设计样式）。关于您的链接，它们没有将验证器封装在自定义组件中，他们只是将它从基于模板的表单中的
required
属性移动到反应表单中的
Validators.required
符号。但他们仍然必须参考它。