gistfile1.js

ngView.directive('myModal', function() { // in the template, the 'container' of your modal would have my-modal as an attribute
  return {
    scope: true,
    link: function(scope, element, attrs) {

      $(element).modal({show:false, backdrop:true, keyboard:true }); // this is instantiating a bootstrap modal i think

      scope.$on('showModal', function (eventObj, record) {

        scope.record = record; // refer to properties in the template like {{record.property}}
        
        scope.showModal = true; // bootstrap modal visibility can be toggled with a model variable
      });

      scope.$on('hideModals', function () { // my page controllers fire this off to close open modals when the url changes
        scope.showModal = false;
      });
    }
}});

gistfile2.html

 <!-- bootstrap styled modal -->
 <div ui-modal class="fade hide" ng-model="showModal"><!-- directive updates this model variable to toggle visibility, could also use ng-show -->
    <div class="modal-header">
    </div>
    <div class="modal-body">
    {{record}}
    </div>
    <div class="modal-footer">
    </div>
  </div>