title: angular- bind form submit with multiple buttons
body: <p>I have a form with multiple submit buttons:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;form name="myForm" customSubmit&gt;
      &lt;input type="text" ng-minlength="2"&gt;
  
      &lt;button type="submit" ng-click="foo1()"&gt;&lt;/button&gt;
      &lt;button type="submit" ng-click="foo2()"&gt;&lt;/button&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>and a directive:
  </p>
  
  <pre><code>angular.module('customSubmit', [])
      .directive('customSubmit', function() {
  
      return {
          require: '^form',
          scope: {
              submit: '&amp;'
          },
          link: function(scope, element, attrs, form) {
              element.on('submit', function() {
                  scope.$apply(function() {
                      form.$submitted = true;
                      if (form.$valid) {
                          return scope.submit();
                      }
                  });
              });
          }
      };
  });
  </code></pre>
  
  <p>my goal is to submit the form only when it's valid, with multiple submit buttons (i.e. I can't use the ng-submit directive in the form). The above code doesn't work. What is the correct way to do that? Is that even possible?</p>