找不到管道：Angular 5 自定义管道

Posted 2023-03-13

【中文标题】找不到管道：Angular 5 自定义管道

【英文标题】：Pipe could not be found: Angular 5 custom pipe

【发布时间】：2018-07-05 03:57:45

【问题描述】：

我已阅读 this post 和 this article。我相信我已经完成了建议的一切：将管道添加到共享的模块中。

但是，无论我做什么，我都无法让我的模板找到我创建的管道。我的应用程序已经有一个其他模块导入的共享模块，所以我创建了管道并将其添加到共享模块中：

我用ng g pipe /shared/pipes/safe --flat --module shared --spec=false创建它

在 SharedModule 中，我也将其添加到 declarations 和 providers。

一切都在运行，但我尝试使用管道，如下所示：

<iframe width="600" height="360" [src]="video.acf.youtube_url | safe: 'url'" frameborder="0" allowfullscreen></iframe>

我只是得到一个错误

Error: Uncaught (in promise): Error: Template parse errors: The pipe 'safe' could not be found

管道本身就是

import  Pipe, PipeTransform  from '@angular/core';
import  DomSanitizer, Safehtml, SafeStyle, SafeScript, SafeUrl, SafeResourceUrl  from '@angular/platform-browser';

@Pipe(
  name: 'safe'
)
export class SafePipe implements PipeTransform 

  constructor(protected sanitizer: DomSanitizer)  

  public transform(value: any, type: string): SafeHtml | SafeStyle | SafeScript | SafeUrl | SafeResourceUrl 
    switch (type) 
      case 'html': return this.sanitizer.bypassSecurityTrustHtml(value);
      case 'style': return this.sanitizer.bypassSecurityTrustStyle(value);
      case 'script': return this.sanitizer.bypassSecurityTrustScript(value);
      case 'url': return this.sanitizer.bypassSecurityTrustUrl(value);
      case 'resourceUrl': return this.sanitizer.bypassSecurityTrustResourceUrl(value);
      default: throw new Error(`Invalid safe type specified: $type`);
    
  

【参考方案1】：

您还需要将其添加到 SharedModule 导出下，

exports: [
   SafePipe
]