Question

我有一个自定义过滤器，我需要添加到指令的内部范围，并且在指令中使用过滤器作为attr的所有示例都不适用于我。有谁知道如何使这项工作？

指令：

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');
    }

在angularjs中应用过滤器作为指令的属性

1 个答案: