1

我正在使用 es5 构建 angular2 应用程序。我有一个屏幕,其中有两个搜索输入字段来过滤两个不同的列表。

为此,我定义了两个不同的管道,如下所述

(function(app) {
    app.filterPipe1 = ng.core.Pipe({
        name : "filter1",
        pure:true
    }).Class({
        constructor : function() {
        }, // <<< ---
        transform : function(values, args) {
        return values.filter(function(value) {
                    return value.title.toLowerCase().startsWith(args[0].toLowerCase());
                });
        }
    });
})(window.app || (window.app = {}));


(function(app) {
    app.filterPipe2 = ng.core.Pipe({
        name : "filter2",
        pure:true
    }).Class({
        constructor : function() {
        }, // <<< ---
        transform : function(values, args) {


                return values.filter(function(value) {
                    return value.title.toLowerCase().startsWith(args[0].toLowerCase());
                });

        }
    });
})(window.app || (window.app = {}));

组件1.js

app.component1 = ng.core
        .Component(
                {
                    directives : [ ng.router.ROUTER_DIRECTIVES,
                            app.componenttest ],
                    pipes : [ app.filterPipe1,app.filterPipe2 ],
                    templateUrl : 'test1.html'
                })

运行时出现以下错误“找不到管道”

同样有趣的是,当我从组件中的管道中删除任何一个声明时,它正在工作。

更新

在html中使用过滤器如下

    <input type="text" placeholder="Search"
                                            [(ngModel)]="inputSearch1">

<li
                                        *ngFor="#category of categoryList |  filter1:inputSearch1 #i=index">





    <input type="text" placeholder="Search"
                                            [(ngModel)]="inputSearch2">

<li
                                        *ngFor="#objective of objectiveList |  filter2:inputSearch2 #i=index">

有人遇到过这个问题吗?

4

0 回答 0