Question

我将此脚本用于页面分页，如本教程http://fdietz.github.io/recipes-with-angular-js/common-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);
    };
});

一切都很顺利，只是我收到了错误

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

Answer 1

尝试：

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

这是什么意思？

每个过滤器必须使用input并返回output。
每个过滤器必须根据条件构建。这意味着，在示例中：给定一个开始，给我一个接受输入并产生输出切片的函数（start，10）。
这很像装饰模式。
不相信我？阅读official doc以了解过滤器是如何处理高阶函数的（返回函数的函数 - 此函数成为条件工厂，结果函数仅用于定义函数的目的）。

你的错误是什么？

在包装函数（比方说）中，您必须只提供用于定义将成为实际过滤器的函数的参数。您将此过滤器用作{{ myArray|offset:3 }}，并且只接收一个参数：(start)，在本例中为3。
包装函数将完全一个参数（名称无关紧要）。

为了进一步说明这一点:(编辑......）

让我们为一个参数制作一个新的过滤器，一个比你的过滤器更多：

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

每个过滤器都是工厂（实际上：它是工厂）。这个采用两个参数并产生实际的滤波器。实际过滤器是一个接受参数并返回过滤值的函数。内部标准由我传递给包装函数的参数定义。

所以当你像这样使用它时：

{{ myArray | limit:5:5 }}

你说的是：

拿参数（5,5）。
创建一个接受输入并将其切片的函数（5,10），并将其返回。
将返回的函数应用于myArray。

TypeError：无法读取未定义的属性“slice”

1 个答案: