我似乎无法解决这个错误.我有搜索栏和ngFor.我试图使用这样的自定义管道来过滤数组:
import { Pipe,PipeTransform } from '@angular/core'; import { User } from '../user/user'; @Pipe({ name: 'usersPipe',pure: false }) export class UsersPipe implements PipeTransform { transform(users: User [],searchTerm: string) { return users.filter(user => user.name.indexOf(searchTerm) !== -1); } }
用法:
<input [(ngModel)]="searchTerm" type="text" placeholder="Search users"> <div *ngFor="let user of (users | usersPipe:searchTerm)"> ... </div>
错误:
zone.js:478 Unhandled Promise rejection: Template parse errors: The pipe 'usersPipe' could not be found (" <div class="row"> <div [ERROR ->]*ngFor="let user of (user | usersPipe:searchTerm)">
角度版本:
"@angular/common": "2.0.0-rc.5","@angular/compiler": "2.0.0-rc.5","@angular/core": "2.0.0-rc.5","@angular/platform-browser": "2.0.0-rc.5","@angular/platform-browser-dynamic": "2.0.0-rc.5","@angular/router": "3.0.0-rc.1","@angular/forms": "0.3.0","@angular/http": "2.0.0-rc.5","es6-shim": "^0.35.0","reflect-Metadata": "0.1.3","rxjs": "5.0.0-beta.6","systemjs": "0.19.26","bootstrap": "^3.3.6","zone.js": "^0.6.12"
确保您没有面对“交叉模块”问题
如果使用管道的组件不属于已声明管道组件“全局”的模块,则找不到管道,并收到此错误消息.
在我的情况下,我已经将管道声明在一个单独的模块中,并将此管道模块导入任何其他使用管道的组件的模块中.
我已经宣布了
您正在使用管道的组件是
管道模块
import { NgModule } from '@angular/core'; import { myDateFormat } from '../directives/myDateFormat'; @NgModule({ imports: [],declarations: [myDateFormat],exports: [myDateFormat],}) export class PipeModule { static forRoot() { return { ngModule: PipeModule,providers: [],}; } }
在另一个模块中使用(例如app.module)
// Import APPLICATION MODULES ... import { PipeModule } from './tools/PipeModule'; @NgModule({ imports: [ ...,PipeModule.forRoot() .... ],