AngularJS $ modal悬停在弹出窗口上

Question

我想要一个悬停式弹出窗口，只有当我将鼠标悬停在屏幕上的某个元素上时才会显示。我目前正在使用$ modal进行模态，我想也许我可以使用它。我遇到的问题是，当我不再超过页面元素时，我不确定如何让模态消失。模态中不需要任何动作，我只是希望它在我超过元素时出现，并在我移动元素时消失。

这是我的傻瓜：http://plnkr.co/edit/3vWVRA0CM7vrMugImgmX?p=preview

以下是我正在寻找的使用jQuery的示例：http://www.sundoginteractive.com/sunblog/posts/jquery-hover-box

var myApp = angular.module('myApp', ['ui.bootstrap']);

myApp.controller('myCtrl', ['$modal', '$scope', '$log',
    function ($modal, $scope, $log) {
      $scope.option = {
        name: 'Name (hover over for more details)',
        longDescription: 'This is my detailed description...  lots of text here'
      }
       $scope.showOptionDetails = function(option) {
            $log.info($scope.option);
            $scope.optionModal = $modal.open({
                template: '<div class="modal-header"><h3 class="modal-title">Option</h3></div><div class="modal-body">{{option.longDescription}}</div><div class="modal-footer"></div>',
                controller: 'modalCtrl',
                resolve: {
                    option: function() {
                      return $scope.option;
                    }
                }
            });
       }

        $scope.closeOptionDetails = function() {
            $scope.optionModal.close();
        }
      }
  ]);

  myApp.controller('modalCtrl', [
    '$modalInstance', '$scope', '$log', 'option', function ($modalInstance, $scope, $log, option) {
      $log.info(option);
      $scope.option = option;
    }
]);