javascript - 获取 'Could Not Be Found' 错误 : Custom Pipe in Angular 2 App

Question

我创建了一个自定义管道以在我的 Angular 2 应用程序中使用。我使用管道的 View 代码如下所示:

<div class="search-item-name">{{result.name}} <span class="search-context">{{result.type | contextualize}}</span></div>

管道文件本身如下所示:

从“@angular/core”导入{ Pipe, PipeTransform }；

@Pipe({name: 'contextualize'})
export class ContextPipe implements PipeTransform {

    transform(value: string) {
       // Logic here...
        }
    }
}

但是，在尝试在组件 View 中使用它之后，我收到此错误:

Template parse errors: The pipe 'contextualize' could not be found

我不清楚为什么会出现这种情况。我已将管道放入共享模块中:

import { ContextPipe } from './context.pipe';
import { CapitalizePipe } from './capitalize.pipe';
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AbbreviatePipe } from './abbreviate.pipe';

@NgModule({
  imports: [
    CommonModule
  ],
  declarations: [
    CapitalizePipe,
    AbbreviatePipe,
    ContextPipe
  ],
  exports: [
    CapitalizePipe,
    AbbreviatePipe,
    ContextPipe
  ],
})
export class SharedModule { }

然后，在根 ngModule 和我尝试使用此管道的组件中，我导入了该 SharedModule。但仍然出现错误。我在这里忽略了什么吗？

Answer 1

将其添加到您的管道代码:

constructor() { }

像这样:

@Pipe({name: 'contextualize'})
export class ContextPipe implements PipeTransform {

    constructor() { }

    transform(value: string) {
       // Logic here...
        }
    }
}