电子邮件验证模式在 Angular fo 中无法正常工作

Question

我在我的角度形式中使用电子邮件验证，它在大多数情况下工作正常。但是，如果我以“test@test”形式输入电子邮件地址，它会在电子邮件周围显示红色轮廓，但不会显示错误消息。当我以 test@test 的形式输入电子邮件时。 ，它显示红色轮廓以及错误消息，这正是我想要的。请帮我看看是不是图案有问题还是其他什么问题。 当我以 test@test 形式输入电子邮件时，我需要显示错误消息

.ts

emailPattern = 
new RegExp(`^(?!\\.)(?!.*\\.$)(?=.{1,64}@)[^@]{1,64}` + `@(?:(?:[a-zA-Z0-9-]+\\.)+[a-zA-Z]{2,})$`,);

const formControls = {
emailAddress: [
        { value: form?.emailAddress, disabled: formValuesDisabled },
        [Validators.required, Validators.email, Validators.pattern(this.emailPattern)],
      ],
}

.html

<mat-form-field appearance="outline" hideRequiredMarker="true">
 <mat-label>Email</mat-label>
<input
matInput
formControlName="emailAddress"
type="email"
#emailAddress
/>
@if (uForm.get(control.fName)?.hasError('required')) {
<mat-error>{{ control.validationError[0].value }}</mat-error>
} @if (uForm.get(control.fName)?.hasError('email')) {
<mat-error>{{ control.validationError[0].value }}</mat-error>
}
</mat-form-field>

Answer 1

您的正则表达式预计在

.aa

之后至少有一个

@

。

这是不使用复杂正则表达式的一个很好的理由。除非您知道如何阅读正则表达式，否则这会很令人困惑。您具体要查找的部分是

.)+[a-zA-Z]{2,})$

，即

.

，然后是两个字符。

我建议您使用 Angular 验证器。