Javascript angular js中的jquery插件在路由到另一个部分然后返回后停止工作

我在应用程序的第一页使用maphilight绘制图像地图，打开应用程序后效果非常好。但是，在单击其中一个区域并路由到新页面，然后通过返回搜索链接或浏览器返回箭头返回到imagemap页面后，地图区域不再在鼠标上方高亮显示。在翻了一番之后，我想我可能需要把页面翻过来重新加载或者类似的东西？不过，我不知道如何做到这一点。提前感谢您的反馈

Maphilight指令

myApp.directive('highlight', function() {
    return {
    restrict: 'A',
    link: $(function(scope, element, attrs) {
      $('img[usemap]').maphilight();
    })};
}); 

部分包含图像映射

<section class="artistinfo">
  <div class="artist cf">
    <h1>Select a room for more details</h1>
  <div class="info">
     <img ng-src="images/housediagram.jpg" alt="Photo of thing" class="map" usemap="#houseMap" highlight>

    <map name="houseMap" id="map">
      <area ng-repeat="room in rooms" name="{{room.name}}" id="{{room.id}}"  shape="poly" coords="{{room.coords}}" href="#/diagram/{{room.id}}" />
    </map>
   </div>
 </div>
</section>

---

提前感谢大家

您的指令的链接功能不应该针对特定元素而不是所有元素吗？否则，您将全部初始化n次，其中n是有多少次。虽然我怀疑解决这个问题会解决您的问题，但如果您指的是img[usemap]部分，那么效率会更高。是的，我相信我应该放元素，但是当我进行此更改时，maphilight不再在@KevinB工作

roomControllers.controller('DiagramController', ['$scope', '$timeout',  '$http', function($scope, $timeout, $http) {
 $http.get('js/master.json').success(function(data) {
    $scope.rooms = data;

 });
}]);