Angular 4模板“无法找到管道”

Question

我正在尝试在Angular 4项目中使用自定义构建的管道。无法弄清楚为什么编译器无法在组件模板中识别我的管道。

QFormat管道

@Pipe({  name: 'qFormat'})
export class QFormatPipe implements PipeTransform {...}

SharedModule

@NgModule({
    declarations: [QFormatPipe],
    exports: [QFormatPipe]
})
export class SharedModule { }

FeatureModule

@NgModule({
  imports: [SharedModule],
  declarations: [MyComponent]
})
export class FeatureModule{ }

MyComponent.html

<div>{{someProp | qformat}}</div>
                  ^^^^^^^

模板抛出错误：

  

Angular：无法找到管道'qformat'

我错过了什么吗？

Answer 1

在我的情况下，问题是通过CLI生成是在app.module.ts内添加管道，但我正在使用的组件的模块是不同的。或者在您的情况下，您可能未注册管道/错误注册的管道，您正在使用模块。

所以快速解决方案是：

  

删除您已创建的管道（不要忘记将其删除   app.module.ts）。然后创建一个像管道的文件夹：然后生成一个   它的模块类似于模块管道/管道 - 常见＆＃39;

然后生成管道，例如管道myPipeExample`，现在不要忘记添加它

声明：[myPipeExamplePipe] 数组和

导出：[myPipeExamplePipe] 数组

现在将模块导入要使其工作的模块中。

This question has multiple very helpful answers

Answer 2

它无法找到管道的原因是因为您将管道注册为“qFormat”＃39;使用大写字母F，但在HTML中，您有“qformat”字样。用小写字母f。这就是错误发生的原因。您的共享模块注册和导入/导出完全是关键。 HTML应该是：

<div>{{someProp | qFormat}}</div>

希望这有帮助！

Answer 3

我很简单，只是忘记将它注册到我的@NgModule