title: AngularJS with ngMessages: skip pattern while length is invalid
body: <p>I have such part of form:</p>
  
  <pre><code>&lt;div ng-messages="submittedFrgPwd &amp;&amp; forgotForm.username.$error" multiple&gt;
    &lt;div ng-message="pattern"&gt;{{ 'INVALID_EMAIL' | translate }}&lt;/div&gt;
    &lt;div ng-message="required"&gt;{{ 'EMPTY_EMAIL' | translate }}&lt;/div&gt;
    &lt;div ng-message="minlength"&gt;{{ 'SHORT_EMAIL' | translate }}&lt;/div&gt;
    &lt;div ng-message="maxlength"&gt;{{ 'LONG_EMAIL' | translate }}&lt;/div&gt;
  &lt;/div&gt;
  &lt;input type="email" id="username-remember" name="username" ng-model="username" ng-minlength="8" ng-maxlength="200" required ng-pattern="email_regexp" ng-class="{ 'has-error': submittedFrgPwd &amp;&amp; forgotForm.username.$invalid || submittedError}"/&gt;
  </code></pre>
  
  <p>and for example:</p>
  
  <p>when i enter email of normal length, but with invalid pattern i see only:</p>
  
  <pre><code>{{ 'INVALID_EMAIL' | translate }}
  </code></pre>
  
  <p>and this is normall.</p>
  
  <p>but!</p>
  
  <p>when i enter something like <code>a@a.a</code> i get both errors:</p>
  
  <pre><code>&lt;div ng-message="pattern"&gt;{{ 'INVALID_EMAIL' | translate }}&lt;/div&gt;
  &lt;div ng-message="minlength"&gt;{{ 'SHORT_EMAIL' | translate }}&lt;/div&gt;
  </code></pre>
  
  <p>but is this real, to <strong>skip pattern messages until my min length is valid</strong>?</p>
  
  <p>i try it so:
  <code>data-ng-show="submittedFrgPwd &amp;&amp; forgotForm.username.$error.pattern &amp;&amp; !forgotForm.username.$error.minlength &amp;&amp; !forgotForm.username.$error.maxlength"</code></p>
  
  <p>seems to work, but it's to ugly)</p>