最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - TypeError: Cannot read property 'slice' of undefined - Stack Overflow

programmeradmin3浏览0评论

I use this script for page pagination like in this tutorial .html

app.filter('offset', function() {
    return function(input, start) {
        start = parseInt(start, 10);
        return input.slice(start);
    };
});

Everything went fine, except that I got an error

TypeError: Cannot read property 'slice' of undefined
at k.<anonymous> (/:18:17)
at e (.min.js:171:180)
at db.| (.min.js:160:65)
at F.constant (.min.js:170:82)
at db.| (.min.js:160:70)
at F.constant (.min.js:170:82)
at Object.$watch.p (.min.js:107:159)
at k.$digest (.min.js:109:78)
at k.$apply (.min.js:112:173)
at h (.min.js:72:300) </pre>

I use this script for page pagination like in this tutorial http://fdietz.github.io/recipes-with-angular-js/mon-user-interface-patterns/paginating-through-client-side-data.html

app.filter('offset', function() {
    return function(input, start) {
        start = parseInt(start, 10);
        return input.slice(start);
    };
});

Everything went fine, except that I got an error

TypeError: Cannot read property 'slice' of undefined
at k.<anonymous> (http://www.foo./43267ztX/default/:18:17)
at e (http://www.foo./43267ztX/default/js/angular.min.js:171:180)
at db.| (http://www.foo./43267ztX/default/js/angular.min.js:160:65)
at F.constant (http://www.foo./43267ztX/default/js/angular.min.js:170:82)
at db.| (http://www.foo./43267ztX/default/js/angular.min.js:160:70)
at F.constant (http://www.foo./43267ztX/default/js/angular.min.js:170:82)
at Object.$watch.p (http://www.foo./43267ztX/default/js/angular.min.js:107:159)
at k.$digest (http://www.foo./43267ztX/default/js/angular.min.js:109:78)
at k.$apply (http://www.foo./43267ztX/default/js/angular.min.js:112:173)
at h (http://www.foo./43267ztX/default/js/angular.min.js:72:300) </pre>
Share Improve this question edited Jul 29, 2014 at 20:20 Bergi 666k161 gold badges1k silver badges1.5k bronze badges asked Jul 29, 2014 at 19:56 haipham23haipham23 4762 gold badges8 silver badges21 bronze badges 4
  • So if slice isn't a property of undefined, which of your variables must be undefined? Your answer is in the error message. – Mike Cluck Commented Jul 29, 2014 at 19:58
  • show other codes... i got also error like that but the filter was not the reason.. try to review other codes you have.. but show other codes related to you filter will help.. – Datz Me Commented Aug 20, 2014 at 7:37
  • 2 Actually, that error is prehensive. I am so sure that input is undefined. – choz Commented Jul 31, 2016 at 2:27
  • I see no error. I use the jsfiddle on the site mentioned in the post. Can this be closed if it is not a problem ? – bhantol Commented Jul 10, 2017 at 21:00
Add a ment  | 

1 Answer 1

Reset to default 2

Try:

app.filter('offset', function(start) {
    return function(input) {
        start = parseInt(start, 10);
        return input.slice(start);
    };
});

What does this mean?

  1. Each filter must take an input and return an output.
  2. Each filter must be built from criteria. This means, in the example: given a certain start, give me a function which takes an input and produces an output slicing (start, 10).
  3. It's much like the decorator pattern.
  4. Don't believe me? Read the official doc to see how filters are high-order functions (functions that return functions - this functions bee criteria factories, and the resulting function is used only on the purpose of the defined function).

What were your errors?

  1. In the wrapper function (let's say), you must only give parameters which will have use on defining the function which will be the actual filter. You will use this filter as{{ myArray|offset:3 }}, and only receive ONE parameter: (start) which will, in this case, 3.
  2. The wrapped function will take exactly one parameter (the name does not matter).

To illustrate this even more: (editing...)

Let's make a new filter, one with more caps than yours for one parameter:

app.filter('limit', function(start, count) {
    start = parseInt(start);
    count = parseInt(count);
    return function(input) {
        return input.slice(start, start + count);
    }
});

Each filter is kind of a factory (actually: it is a factory). This one takes two parameters and yields the actual filter. The actual filter is a function that takes a parameter and returns a filtered value. The inner criteria is defined by the parameters I passed to the wrapper function.

So when you use it like this:

{{ myArray | limit:5:5 }}

You say something like:

  1. Take the arguments (5, 5).
  2. Create a function which takes an input and slices it on (5, 10), and return it.
  3. Apply that returned function to myArray.
发布评论

评论列表(0)

  1. 暂无评论