Angular directive for a button that shows an animation when "processing". Good for when a form is being posted, and the user is waiting for a result

angular_processing_button_directive.js

// Requires font-awesome for spinning functionality
angular.module('buttonUtils')
  .directive('processingButton', function() {
    return {
      scope: {
        buttonText:"@",
        buttonProcessing: "="
      },
      link: function(scope, element, attrs) {

        var $span = element.find('span');
        scope.$watch('buttonProcessing', function(val) {
          console.log('watching', val);
          if (val) {
            $span.addClass('fa-pulse fa-spinner');
          } else {
            $span.removeClass('fa-pulse fa-spinner');
          }
        });
      },
      template: ['<button type="submit" class="btn btn-primary submit-button">',
                    '<span class="fa " class="form-control">',
                    '</span>',
                    ' {{buttonText}}',
                  '</button>'
                ].join('')
    };

  });