ngSubmitLoading

gistfile1.js

(function(angular) {
  'use strict';

  var module = angular.module('ngSubmitLoading', []);

  /**
   * A directive that adds a `$loading` attribute to the ngForm controller
   * until the promise is fullfilled.
   *
   * @example
   *
   *   <form name="form" ng-submit-loading="fnThatReturnsPromise()">
   *     <button ng-disabled="form.$loading">
   *       Submit
   *     </button>
   *   </form>
   */
  module.directive('ngSubmitLoading', function($parse) {
    return {
      require: '^form',
      compile: function($element, attr) {
        var fn = $parse(attr.ngSubmitLoading);
        return function(scope, element, attr, ctrl) {
          element.on('submit', function(event) {
            scope.$apply(function() {
              ctrl.$loading = true;
              fn(scope, { $event: event }).finally(function() {
                ctrl.$loading = false;
              });
            });
          });
        };
      }
    };
  });

});