11.2.6 - 自定义异步表单验证器

• 需求：当用户在文本框输入完内容，离开焦点以后，验证输入的内容是否是唯一的 ```typescript import { AbstractControl, ValidationErrors } from “@angular/forms”

// 定义一个类 export class myValidators { static shouldBeUnique(control: AbstractControl): Promise { return new Promise(resolve => { if (control.value == “admin”) { resolve({ shouldBeUnique: true }) } else { resolve(null) } }) } }

```typescript
// src/app/validators/validators.component.ts
import { myValidators } from '../myValidators';
contactForm: FormGroup = new FormGroup({
    name: new FormControl("默认值", [
        Validators.required,
    ], myValidators.shouldBeUnique) // FormControl 的第三个参数是异步规则
})

<div *ngIf="name.touched && name.invalid && name.errors">
    <div *ngIf="name.errors?.['shouldBeUnique']">用户名重复</div>
</div>
<div *ngIf="name.pending">正在检测姓名是否重复</div>