title: AngularJS Form Validation with Directives - "myform.$valid" not quite right for me
body: <p>I've hacked a solution to my problem, but I am not pleased, it doesn't feel "angular" to me, and it adds to the maintenance of the code.</p>
  
  <p>First, the form requirements:</p>
  
  <ol><li>Modular Directives (so I can re-use them.)</li>
  <li>Each field can have multiple errors, <b>but only one is shown at a time</b>, in a logical order...</li>
  <li>Hide the submit button until the form <b>is complete</b>, not just valid.</li>
  <li>Bootstrap Themed</li>
  <li>Do it "the angular way."</li>
  </ol>
  
  <p>The problem is #3.  I tried this:</p>
  
  <pre><code>&lt;div ng-show="myform.$valid"&gt;
     &lt;input type="submit" value="Submit" /&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>But this just makes the submit button show up as soon as one field is valid, and then it hides again as you start the next field.  My "hack fix" was to create variables on the scope and a method in the controller to check them all (mainly to keep the view clean...) But this just doesn't feel right.</p>
  
  <p>Here's my fiddle:
  <a href="http://jsfiddle.net/thomporter/e3jye/">http://jsfiddle.net/thomporter/e3jye/</a></p>