表情符号的 Angular 输入验证

Question

如何验证表情符号的输入。如果输入 Emoji 需要显示错误信息。

表单域是

 'name': new FormControl('', [Validators.required]),

Answer 1

创建一个自定义验证函数并在您的组件文件中使用它。

我创建了一个通用的自定义函数并为此创建了一个组件文件:

自定义验证器.ts

export function Noemotics(): ValidatorFn {
   return (control: AbstractControl): any => {
      window.setTimeout(() => {
         if (control.value && control.value != '') {
             let trimedvalue = control.value.replace(/[^a-zA-Z0-9 ]/gm, '');
             control.setValue(trimedvalue);
          }
      }, 10);
   };
}

现在您可以在项目的任何地方使用这个函数。您应该必须将此函数导入组件文件。

  import { Noemotics } from '../Shared/custom-validators';

将此函数指定到您必须对表单控件进行验证的位置。在 Angular 我们使用如下所示:

    this.RegisterFormGroup = this.fb.group({        
        firstname: ['', Validators.compose([Validators.required, Noemotics()])]          
    });