Примените фильтр в качестве атрибута директивы в angularjs

Question

У меня есть собственный фильтр, который мне нужно добавить во внутренний диапазон директивы, и все примеры использования фильтра в качестве атрибута в директиве не сработали для меня. Кто-нибудь знает, как заставить это работать?

Директива:

import angular from 'angular';

function userName() {
    return {
        restrict: 'E',
        scope: {
            user: '=',
            dataFilter: '@'
        },
        template: require('./user-name.pug'),
        link: function($scope, $el, $attr, $filter) {
            let filter = $filter($attr['dataFilter']);
        }
    }
}

export default angular.module('directives.username', [])
    .directive('userName', userName)
    .name;

HTML:

<user-name user="vm.user" dataFilter="ellipsisMaxLength:20" class="layout-align-center-center layout-row">
    <!-- ngIf: user.display_name -->
    <!-- ngIf: !user.display_name -->
    <span ng-if="!user.display_name" class="ng-binding ng-scope">Person McPersonson</span>
    <!-- end ngIf: !user.display_name -->
</user-name>

Я хочу, чтобы фильтр был применен к внутреннему тексту диапазона. Я не могу добавить фильтр непосредственно в шаблон.

Спасибо!

Answer 1

Вам нужно получить тег span и добавить стиль к нему примерно так

link: function($scope, $el, $attr, $filter) {
        let filter = $filter($attr['dataFilter']);
        var span = $el.first();
        span.css('text-overflow','ellipsis');
        span.css('overflow','hidden');
        span.css('white-space','nowrap');
    }