在angular2中编写用于香菜的自定义验证器

import { Directive, forwardRef } from '@angular/core';
import { NG_VALIDATORS, Validator, AbstractControl } from '@angular/forms';

@Directive({
  selector: '[cilantroValidator][ngModel],[cilantroValidator][formControl]',
  providers: [
    {
      provide: NG_VALIDATORS,
      useExisting: forwardRef(() => CilantroValidatorDirective),
      multi: true
    }
  ]
})
export class CilantroValidatorDirective implements Validator {
  validate(control: AbstractControl): { [key: string]: any } | null {
    const value = control.value;
    
    // 在这里编写自定义验证逻辑
    // 检查输入值是否符合香菜的规则
    
    if (value !== '香菜') {
      return { cilantro: true };
    }
    
    return null;
  }
}

<input type="text" [(ngModel)]="cilantro" name="cilantro" cilantroValidator>

<div *ngIf="cilantro.invalid && (cilantro.dirty || cilantro.touched)">
  <div *ngIf="cilantro.errors.cilantro">
    输入值必须是香菜！
  </div>
</div>