title: Show tooltip only when the text is truncated in angular UI bootstrap directive
body: <p>I want to show angular UI bootsrap tooltip only when the text is truncated.
  I tried the below code with custom directive</p>
  
  <pre><code>&lt;div tooltip="{{value}}" tooltip-append-to-body="true" enable-truncate-tooltip&gt;{{value}}&lt;/div&gt;
  
  .directive("enableTruncateTooltip", function () {
    return {
      restrict: 'A',
      link: function (scope, elem, attr) {
        elem.bind('mouseenter', function () {
          var $this = angular.element(this);
  
          if (this.offsetWidth &gt;= this.scrollWidth) {
            angular.element('.tooltip').attr('hide-tooltip', true);
          }
        });
      }
    }
  })
  </code></pre>
  
  <p>It works fine in angular-ui-bootstrap version <strong>0.12.1</strong>. But later versions are not supporting this. </p>
  
  <p>How can i achieve this same functionality in latest version of angular-ui-bootstrap?</p>
  
  <p>Thanks in advance for your help.</p>