Angular JS 指令 - 模板、编译还是链接？

我想创建一个 Angular JS 指令来检查字符串的长度，如果字符串太长，无法使用过滤器缩短它，并在鼠标悬停时显示 Angular-UI 弹出窗口。

我应该在指令中的哪个位置放置功能以使其正常工作（链接、模板或编译）？

风景：

<div myapp-shorten="project">{{project.Description}}</div>

到目前为止，这是我对该指令的首次尝试：

angular.module('myapp.directives', [])
 .directive('myappShorten', function () {

    function link(scope, element, attrs) {

        var outputText = "";

        if (myappShorten.Description.length > 20) {
            outputText += "<div popover='{{myappShorten.Description}}' popover-trigger='mouseenter'>" +
            "{{myappShorten.Description | cut:true:20:' ...'}}</div>";
        } else {
            outputText += "<div>{{myappShorten.Description}}</div>";
        }

        element.text(outputText);
    }

    return {
        link: link,
        scope: {
            myappShorten: "="
        }
    };

});

首先，您可以更改过滤器，如果不需要，它不会改变字符串

其次，由于您只需要过滤器和弹出框 - 模板就足够了。

 angular.module('myapp.directives', [])
   .directive('myappShorten', function () {

     return { 
       scope: { data : '=myappShorten',
       template:"<div popover='{{data.Description}}' popover-trigger='mouseenter'>" +
        "{{ data.Description | cut:true:20:' ...' }}</div>"
     }
   })

或者，您可以使用组合ng-show and ng-hide

 app.directive('shorten', function () {
return {
    restrict: 'A'
    , scope :  {
        shorten : '=',
        thestring: '='   
    }
    , template: "<div ng-show='sCtrl.isLong()' tooltip='{{ sCtrl.str }}'>{{ sCtrl.short() }}</div>"+
                "<div ng-hide='sCtrl.isLong()'>{{ sCtrl.str }}</div>"

    , controllerAs: 'sCtrl'
    , controller: function ($scope) {
        this.str = $scope.shorten || ''
        this.length = $scope.thestring || 20

        this.isLong = function() {
            return this.str.length > this.length   
        }

        this.short = function() {
            if ( this.str.length > this.length)  {
                return this.str.substring(0,this.length)  + '...'                    
            }
        }                                  
    }                               
  }       
})

第三种选择是在 myappShrten.Description 上实际使用编译和 $watch，但这对我来说似乎有点过分了。