Angular ng-Muster - keine E-Mail-Adresse

Question

Ich versuche zu überprüfen, dass die Benutzereingabe in einem UserName-Feld nicht im Format einer E-Mail-Adresse ist, mit ng-Muster mit Angular. Der folgende Code scheint die gewünschten Ergebnisse zu erzielen. Die Seite wird jedoch mit der Fehlermeldung geladen, die angezeigt wird, bis der Benutzer mit der Eingabe beginnt. Der Fehler verschwindet, wenn die Benutzereingabe nicht mit der E-Mail-Adressenregex übereinstimmt. Wie kann ich diese Nachricht beim Laden der Seite ausblenden und nur anzeigen, wenn der reguläre Ausdruck übereinstimmt? Vielen Dank.

<div ng-show="!form.UserName.$error.pattern" class="errorMessage"> 
    Username is not your email address 
</div>  

<div class=" form-group"> 
    <label class="form-label" for="userName">Username</label> 
    <input class="form-control" ng-pattern="/^([a-zA-Z0-9])+([a-zA-Z0-9._%+-])+@([a-zA-Z0-9_.-])+\.(([a-zA-Z]){2,6})$/" /> 
</div> 

Answer 1

versuchen zu überprüfen, ob der Eingang

"berührt"

<div ng-show="form.UserName.$error.pattern && form.UserName.$touched" class="errorMessage"> 
    Username is not your email address 
</div>