我们有一个动态构建的组件.添加带有验证程序的控件的代码可能如下所示:

var c = new FormControl('', Validators.required);

但是假设我想添加第二个验证器later.我们怎样才能做到这一点呢?我们在网上找不到任何关于这方面的文档.我确实发现在表单控件中有setValidators

this.form.controls["firstName"].setValidators 

但目前尚不清楚如何添加新的或自定义的验证器.

推荐答案

您只需将FormControl个验证程序传递给一组验证程序.

下面是一个示例,演示如何向现有FormControl添加验证程序:

this.form.controls["firstName"].setValidators([Validators.minLength(1), Validators.maxLength(30)]);

请注意,这将重置您在创建FormControl时添加的任何现有验证器.

Angular 12 update

从Angular 12开始,如果您想在不删除现有验证程序的情况下向表单中添加新的验证程序,可以使用addValidator:

this.form.controls["firstName"].addValidators([Validators.minLength(1), Validators.maxLength(30)]);

Angular相关问答推荐

导入浏览器模块时出错已导入commonModule的insted,animationBrower也显示错误,当p打开时

Primeng 12Angular 12自定义库:错误符号字段集声明于...在编译保存后未从Primeng/fieldset中导出

Angular 17:在MouseOver事件上 Select 子组件的正确ElementRef

带区域设置用法的Angular 日期管道

如何使用来自不同可观测对象的值更新可观测对象

基于RxJS的Angular 服务数据缓存

使用 TAB 键时如何聚焦mat-select组件?

Angular 15 在 URL 中使用@进行路由

Angular 升级后 RXJS SwitchMap 无法与解析器一起正常工作

从具有特定 node 值的现有数组创建新数组

Angular2 CLI 错误@angular/compiler-cli包未正确安装

如何在 Angular CLI 1.1.1 版中将路由模块添加到现有模块?

NgrxStore 和 Angular - 大量使用异步管道或在构造函数中只订阅一次

如何从 EventEmitter 函数返回值?

Angular 2:为什么在检索路由参数时使用 switchMap?

具有多个订阅者的 Angular 2 Observable

Angular 2 router.navigate

如何在 Angular 2 中动态添加和删除表单字段

ng add 与 npm install 在 Angular 6 中的区别

输入更改时Angular2动态输入字段失go 焦点