Rob
Rob

Reputation: 11368

Angular show errors only when input not empty and invalid

I'm trying to toggle an error area on my form that only triggers once there is some input, it's a bit silly to have the errors all appear if the user hasn't started typing yet.

<form name="registerForm">
  <input type="email" name="email" ng-model="email" required />
</form>

<span ng-show="registerForm.email.$invalid">
  Invalid email.
</span>

This works fine once I'm typing but I want it to show no errors if the input is empty. I've tried using the model ng-hide="!email.length" but can't get it to work.

Upvotes: 3

Views: 4632

Answers (2)

KP87
KP87

Reputation: 91

Try this:

<span ng-show="registerForm.email.$invalid && email>

Upvotes: 0

adrichman
adrichman

Reputation: 1235

<span ng-show="registerForm.email.$invalid && registerForm.email.$dirty>

Upvotes: 2

Related Questions