Question

我有一个过滤器，linkifyStuff，我希望使用另一个过滤器处理一些变量。我无法弄清楚从另一个过滤器调用一个过滤器的语法。

我知道过滤器链接 - 这不是我想要做的。我想将过滤器应用于linkifyStuff过滤器中的局部变量，而不是其输入或输出。

我希望下面会有类似的工作，但$ filter（'filtername'）显然不是正确的语法。

module.filter('sanitizeStuff', function() {
    // ...
})

module.filter('prettifyStuff', function() {
    // ...
})

module.filter('linkifyStuff', function($filter) {
    return function(text) {
        // ...
        // ...
        return $filter('sanitizeStuff')(foo) + ' whatever ' + $filter('prettifyStuff')(bar)
    }
})

我可以为sanitizeStuff和sanitizeStuff编写一个普通的js函数，并从这些过滤器中调用该函数，但这似乎是错误的。如何以角度方式做任何建议？

谢谢。

Answer 1

使用linkifyStuff语法将过滤器注入<filterName>Filter。像这样：

app.filter('linkifyStuff', function(sanitizeStuffFilter,prettifyStuffFilter) {
    return function(text) {

        return sanitizeStuffFilter(text) + ' whatever ' + prettifyStuffFilter(text);
    }
});

DEMO

Answer 2

在过滤评论输入之前，我遇到过类似的事情。我有4个不同的过滤器，当用户点击提交时，它会运行一个功能，可以在评论副本上运行所有4个过滤器。把我的过滤器放在那里很好。警告：确保你将$ filter注入你的控制器，我讨厌当我忘记注入东西时。这是代码：

注意：

.controller('Controller', function ($scope, $filter){
    //CODE GOES HERE
});

HTML：

<ul ng-repeat="comment in comments">
    <li>{{comment.user_name}}</li>
    <li dynamic="deliberatelyTrustDangerousSnippet(comment.comment_copy)"></li>
</ul>

控制器：

$scope.deliberatelyTrustDangerousSnippet = function(comment) {
    comment = $filter('breaks')(comment);
    comment = $filter('links')(comment);
    comment = $filter('images')(comment);
    comment = $filter('youtubeLinks')(comment);
    return comment;

};

过滤器：

.filter('breaks', function () {
    return function (text) {
        if (text !== undefined) return text.replace(/&#10;/g, '<br />');
    };
})
.filter('links', function () {
    return function (text) {
        if (text !== undefined){
            return text.replace(/(?:http:\/\/)?(?:www\.)?((?:[\w-\.]*)(?:\.(?:com|net|org|co|be))(?:(?:[\/?\w?=?&?(?:&amp;)?\.?-]*)))/g, '<a target="_blank" href="http://$1">$1</a>');
        }
    };
})
.filter('images', function () {
    return function (text) {
        if (text !== undefined){
            return text.replace(/(?:<.*=")(.*(?:(?:\.(?:jpg|JPG|png|PNG|gif|GIF|jpeg|JPEG))))(?:")(?:.*(?:<\/a>))/g, '<img src="$1"/>');
        }
    };
})
.filter('youtubeLinks', function () {
    return function (text) {
        if (text !== undefined){
            return text.replace(/(?:<.*=")(?:(?:(?:(?:http:\/\/)|(?:www\.)|(?:http:\/\/www\.))(?:(?:youtube\.com.*v=)|(?:youtu\.be\/))((?:\w|\d|-)*)(?:(?:&amp;feature=related)?)))(?:")(?:.*(?:<\/a>))/g, '<youtube id="$1"></youtube>');
        }
    };
})

Answer 3

@useless询问是否“有任何方法可以为默认过滤器执行此操作。”

使用默认过滤器的循环方法：在将标准过滤器传递给自定义过滤器之前将其传递给标准过滤器，并将原始值作为参数传递。

例如，您的Angular表达式如下所示：

{{myDate | date: 'mediumDate' | relativeDate: myDate}}

你的过滤器：

var myApp = angular.module('myApp',[]);
myApp
    .filter('relativeDate', function() {
        return function(formattedDate, dateStr) {
            var returnVal = formattedDate,
                today = new Date(),
                evalDate = new Date(dateStr);
            if (today.getFullYear() == evalDate.getFullYear() &&
                today.getMonth() == evalDate.getMonth() &&
                today.getDate() == evalDate.getDate()) {
                    returnVal = 'Today'
            }
            return returnVal
        }
    })
    .controller('myAppCtrl', ['$scope', function myAppCntrl($scope) {
        $scope.myDate = "2001-01-01T01:01:01";
    });

Answer 4

如何从angular.js中的另一个过滤器调用一个过滤器

5 个答案: