Angular pagination filter error

Question

I have Angular filter for paging (I used this link as tutorial):

publicApp.angularModule.filter('startFrom', function () {
return function(input, start) {
    start = +start; //parse to int
    return input.slice(start);
};

});

And relevant part of my HTML looks like this:

 <div data-ng-repeat="item in filteredData = ( data | filter:leaderBoardFilter) | startFrom:currentPage*pageSize | limitTo:pageSize">

And even though everything works fine and as expected I get this error in console:

"Error: input is undefined
@http://localhost:1936/MadbarzScripts/Public/PublicMain.js:8:9

Error is referencing to this line:

return input.slice(start);

And what is interesting I get error most of the time but not always. How can I fix this ?

Correct syntax in the view could be :
– Christian Bonato Jun 25 '14 at 19:55 — Christian Bonato, Jun 25 '14 at 19:55

score 3 · Accepted Answer · edited Apr 12 '15 at 15:45

A filter should always check the validity of its input. The input might be the result of an async operation, so the filter can't be sure the input is always what it's expecting for when it is being evaluated.

Try this:

publicApp.angularModule.filter('startFrom', function () {
    return function(input, start) {
        if (!angular.isArray(input)) {
            return [];
        }
        start = +start; //parse to int
        return input.slice(start);
    };
});

score 1 · Answer 2 · edited May 23 '17 at 12:02

1

My guess is that your startFrom filter is taking 2 parameters but you are passing only 1 (currentPage*pageSize). Take a look at this:

How do I call an Angular.js filter with multiple arguments?

I am not sure why this happens intermittently but that could be a parameter passing/ordering quirk (given that you are trying to populate 2 arguments with one value).

edited May 23 '17 at 12:02

Community

1
1

answered Jun 25 '14 at 19:44

Sid

7,511
2
28
41

The first argument of filter function is always from the pipe, so `startFrom` filter has only one optional `start` parameters. – Ye Liu Jun 25 '14 at 19:55
Then the problem may be in ( data | filter:leaderBoardFilter) which may be generating an undefined – Sid Jun 25 '14 at 20:01
Indeed! `data` itself might be undefined as well, check my answer. – Ye Liu Jun 25 '14 at 20:10
Makes sense. +1 ed you – Sid Jun 25 '14 at 20:18

score 1 · Answer 3 · answered Feb 15 '17 at 11:16

Needs to check the input exists or not:

Try this:

app.filter('startFrom', function() {
return function(input, start) {
    if (!input || !input.length) { return; }
    start = +start; //parse to int
    return input.slice(start);
}
});

Hope its work..Cheers..

Angular pagination filter error

3 Answers3