Angular Validation校验：输入仅支持拉丁/格鲁吉亚字符 不可混合且无其他字符

原代码错误原因 #

你编写的逻辑直接对正则字符串做布尔运算，没有将正则规则作用到输入的表单值上做匹配判断：非空字符串在JS逻辑判断中会默认返回true，因此你写的逻辑永远返回真，完全不会生效。

正确实现方案 #

1. 编写自定义校验器 #

你可以通过Angular自定义Validator实现需求，代码如下：

import { AbstractControl, ValidationErrors, ValidatorFn } from '@angular/forms';

export function pureCharacterValidator(): ValidatorFn {
  return (control: AbstractControl): ValidationErrors | null => {
    const inputVal = control.value ?? '';
    // 纯格鲁吉亚字符正则
    const georgianOnly = /^[\u10D0-\u10F0]+$/;
    // 纯拉丁字母正则
    const latinOnly = /^[a-zA-Z]+$/;

    // 满足任意一个纯字符规则即校验通过
    return georgianOnly.test(inputVal) || latinOnly.test(inputVal) 
      ? null 
      : { invalidCharacter: true };
  };
}

注：同一个非空输入不可能同时满足纯格鲁吉亚和纯拉丁两个正则规则，因此不需要额外写互斥判断逻辑，天然就能过滤混合输入、包含数字/特殊字符的场景。

2. 表单中引入校验器 #

以响应式表单为例，在控件初始化时加入上述校验器即可：

import { FormControl, FormGroup, Validators } from '@angular/forms';

// 表单初始化
this.validateForm = new FormGroup({
  targetInput: new FormControl('', [
    Validators.required,
    pureCharacterValidator()
  ])
});

如果使用模板驱动表单，将上述校验逻辑封装为Angular指令挂载到对应input控件上即可生效。

内容的提问来源于stack exchange，提问作者user14374256