Как вызвать один фильтр из другого фильтра в angular.js

У меня есть filter, 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)
    }
})

Я мог бы написать простые js-функции для sanitizeStuff и sanitizeStuff и вызвать эту функцию из этих фильтров, но это кажется неправильным. Любые советы о том, как это сделать angular?

Спасибо.

Ответ 1

Внесите фильтры в linkifyStuff с помощью синтаксиса <filterName>Filter. Вот так:

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

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

DEMO

Ответ 2

Я столкнулся с чем-то подобным, прежде чем фильтровать входы комментариев. У меня было 4 разных фильтра, когда пользователь нажал кнопку submit, он запустил бы функцию, которая будет запускать все 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>

CONTROLLER:

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

Ответ 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";
    });

Ответ 4

Самый последний пример:

angular.module('myApp.shared.shared-filters', [])
.filter('capitalize', ['$filter', function($filter) {
  return function(input) {
    return $filter('uppercase')(input.charAt(0)) + $filter('lowercase')(input.substr(1));
  }
}]);

Ответ 5

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

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

Это не сработало для меня. если у кого-то есть проблемы с вышеуказанным кодом. вы можете попробовать это, которое получилось для меня довольно хорошо.

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

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