Quick and easy Angular dialog box

dialogBox.js

angular.module('dialogBox', [])
  .factory('DialogBox', function ($q) {
    var instances = {};

    function DialogBox (name) {
      if (!instances[name]) {
        instances[name] = $q.defer();
      }
      instances[name].resolve(this);

      this.launched = false;
    }

    DialogBox.prototype = {
      launch: function () {
        this.launched = true;
      },
      dismiss: function () {
        this.launched = false;
      }
    };

    DialogBox.get = function (name) {
      if (!instances[name]) {
        instances[name] = $q.defer();
      }
      return instances[name].promise;
    };

    return DialogBox;
  })
  .directive('dialogBox', function (DialogBox) {
    return {
      replace: true,
      templateUrl: 'dialogBox.template.html',
      transclude: true,
      scope: {
        onCancel: '&',
        onSubmit: '&'
      },
      controller: function () {},
      link: function (scope, el, attrs, ctrl) {
        scope.dialogBox = new DialogBox(attrs.dialogBox);

        el.find('.submit').on('click', function (e) {
          scope.$apply(function () {
            e.preventDefault();
            var submitSuccess = scope.onSubmit({
              dialogBox: scope.dialogBox
            });
            if (submitSuccess !== false) {
              scope.dialogBox.dismiss();
            }
          });
        });

        el.find('.cancel').on('click', function (e) {
          scope.$apply(function () {
            e.preventDefault();
            scope.onCancel();
            scope.dialogBox.dismiss();
          });
        });
      }
    };
  })
;

dialogBox.template.html

<div class="dialog-box" ng-show="dialogBox.launched">
  <div class="content" ng-transclude></div>
  <menu>
    <button class="submit" name="button">Submit</button>
    <button class="cancel" name="button">Cancel</button>
  </menu>
</div>

impl.html

<div dialog-box="test" on-submit="ctrl.submit(dialogBox)">
  <h1>Hello, world!</h1>
</div>