在指令中使用过滤器的正确方法是什么？

Question

我正在尝试对我的指令中的已转换文本应用过滤器，但我不确定这是最好的方法。想法的工作副本在以下链接，但我觉得我通过使用编译函数来获取被转换的文本来排除作弊。请参阅JSFiddle。

angular.module("MyApp").directive('highlighter', function () {
    return {
        restrict: 'E',
        replace: true,
        transclude: true,
        scope: {
            phrase: '@',
            text: '@'
        },
        template: '<span ng-bind-html-unsafe=" text | highlight:phrase:false "></span>',
        compile: function (elem, attr, transclude) {
            transclude(elem, function (clone) {
                // grab content and store in text attribute
                var txt = clone[0].textContent;
                attr.text = txt;
            });
        }
    };
});

Answer 1

我想其他方法是http://jsfiddle.net/3vknn/。

angular.module("MyApp").directive('highlighter', function () {
    return {
        restrict: 'E',
        scope: {
            phrase: '@'
        },
        controller: function($scope, $filter) {
            $scope.highlight = $filter('highlight');
        },
        link: function (scope, elem, attr) {
            scope.$watch('phrase', function(phrase) {
                var html = scope.highlight( elem.text(), phrase );
                elem.html( html );
            });
        }
    };
});