Angular Material文档邮箱校验异常：输入aa@aa未触发错误提示

这不是Angular邮箱校验器的问题，而是它的预期行为。

Angular内置的邮箱校验器完全遵循HTML5的邮箱验证规范，该规范只要求邮箱符合「本地用户名@域名」的基本结构，并不强制域名必须包含诸如.com、.cn这类后缀。aa@aa满足这个结构要求，因此校验器不会判定它为无效邮箱。

如果你的业务场景需要更严格的邮箱格式验证（比如强制域名带后缀），可以自定义校验器，示例代码如下：

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

// 自定义严格邮箱校验器
export const strictEmailValidator: ValidatorFn = (control: AbstractControl): ValidationErrors | null => {
  // 正则要求域名必须包含至少两位的后缀
  const strictEmailPattern = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
  return control.value && !strictEmailPattern.test(control.value) ? { invalidStrictEmail: true } : null;
};

在表单控件中使用时，只需将该校验器添加到验证规则数组中即可。

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