在Angular中自定义验证器可以通过创建一个函数,并将其应用到表单控件上来实现。下面是一个简单的例子:
首先,创建一个自定义验证器函数:
import { AbstractControl } from '@angular/forms'; export function customValidator(control: AbstractControl): {[key: string]: any} | null { const valid = control.value =https://www.yisu.com/ask/=='example'; return valid ? null : { custom: true }; }
然后,在组件中将这个验证器函数应用到表单控件上:
import { Component } from '@angular/core'; import { FormBuilder, FormGroup, Validators } from '@angular/forms'; import { customValidator } from './custom-validator'; @Component({ selector: 'app-my-form', templateUrl: './my-form.component.html' }) export class MyFormComponent { myForm: FormGroup; constructor(private fb: FormBuilder) { this.myForm = this.fb.group({ myControl: ['', [Validators.required, customValidator]] }); } }
最后,在模板文件中显示验证错误信息:
通过以上步骤,你就可以在Angular中自定义验证器并进行验证了。