Custom filter in AngularJS after adding pagination

Question

After implementing the pagination to my ng-repeat listing (Update pagination in AngularJS after filtering)

<li ng-repeat="data in filtered = (list | filter:search) ... >

I now have a problem with my custom filter

<li ng-repeat="data in filtered = (list | filter:search) | customFilter:search ... >

I need this filter to search by multiple languages (select two or more languages). If I you replace data in filtered = (list | filter:search) with data in list, you will see it's working. But I need filtered for my pagination.

jsFiddle: http://jsfiddle.net/StinsonMaster/SuEX6/4/ (based on the fiddle from the previous thread)

doublekid · Accepted Answer · 2013-06-04 14:38:06Z

0

I think I misunderstood your original question.

I rewrote your custom filter. It's not exactly objected oriented, but with a little touching up it could be much more extensible. Basically you just needed something that was more inclusive than the base angular filter.

app.filter("customFilter", function() {
    return function(input, search) {
        if(search && search != undefined) {
            var _toRet = new Array();
            for(var i in search) {
                for(var k in input) {
                    if(search.indexOf(input[k].language) != -1 && _toRet.indexOf(input[k]) == -1) {
                        _toRet.push(input[k]);
                    }
                }
            }
            return _toRet;
        } else {
            return input;
        }
    };
});

Also please note the changes to your ngRepeat syntax.

ng-repeat="data in filtered = list | filter:search.name | customFilter:search.language | startFrom:(currentPage-1)*entryLimit | limitTo:entryLimit"

http://jsfiddle.net/doublekid/5Bs3h/

answered Jun 4, 2013 at 14:38

doublekid

463 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

mg1075 Over a year ago

Looks promising. Here is an updated fiddle with valid js references (the original was producing an error). jsfiddle.net/YaQK2

doublekid · Accepted Answer · 2013-05-07 00:10:04Z

0

I would suggest, instead of using an expression in your ng-repeat directive, set the ng-repeat equal to a method on the list's constroller that returns the subset or values you're looking for. For example:

// In your controller

        $scope.filteredList = function() {
           return $filter('filter')($scope.list,{'language':search.language});
        }

// And in your ng-repeat 

        ng-repeat="(key,val) in filteredList()"

Hope this helps!

answered May 7, 2013 at 0:10

doublekid

463 bronze badges

1 Comment

Mischa Over a year ago

Hm, okay... Can you fork my fiddle? I tried your code but didn't figure out how to use it.

Collectives™ on Stack Overflow

Custom filter in AngularJS after adding pagination

2 Answers 2

1 Comment

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related