ngtable에 툴팁을 표시하는 방법은 무엇입니까?

Question

나는 나의 ngtable에서 툴팁을 얻으려고 노력하고이 코드를 사용하고 있습니다 :

http://embed.plnkr.co/v6bqqe/index.html 

내 ngtable은 다음과 같습니다

<table ng-table="tableParams" class="table"> 
     <tr ng-repeat="user in $data"> 
      <td data-title="'Name'">{{user.name}}</td> 
      <td data-title="'Age'">{{user.age}}</td> 

      <td data-title="'Comments'"> 
       <div my-qtip qtip-title="{{user.name}}" qtip-content="{{user.comment}}"> 
        hover here 
       </div> 
      </td> 
     </tr> 
    </table> 

그래서 툴팁으로 USERCOMMENT 속성을 표시하려고합니다. 질문은 댓글 열 위로 마우스를 가져 가면 표에 어떻게 표시합니까?

도 참조 plunkr : http://plnkr.co/edit/8zNSsyzbu2Xbda2NIbnK?p=info

Answer 1

당신은 단지 약간의 변화가 필요합니다

app.directive("myQtip", function() { 

    return function (scope, element, attrs) { 

     /******* This is what's different from myQtip *********/ 

     var text = attrs['qtipContent']; 

      var title = attrs['qtipTitle']; 

     /******************************************************/ 

     scope.qtipSkin = (attrs.skin ? "qtip-" + attrs.skin : "qtip-dark"); 

     element.qtip({ 
      content: { 
       text: text, 
       title: title 
      }, 

      style: { 
       classes: scope.qtipSkin + " qtip-rounded qtip-shadow " 
      }, 
      show: { 
       event: 'click mouseover', 
       solo: true 
      }, 
      hide: { 
       event: (scope.closeButton == true ? "false" : "click mouseleave"), 
       delay: 300, 
       fixed: (($(this).hover || attrs.fixed) ? true : false), //prevent the tooltip from hiding when set to true 
       leave: false 
      }, 
      position: { 
       viewport: $(window),// Keep it on-screen at all times if possible 
       target: (attrs.target ? attrs.target :"event"), 
       my: "bottom center", 
       at: "top center" 
      } 
     }); 

     scope.$on("$destroy", function() { 
      $(element).qtip('destroy', true); // Immediately destroy all tooltips belonging to the selected elements 
     }); 

     $('[my-qtip]').css("display", "inline-block"); 
    } 
});