如何在 Angular 中将其设为 SafeUrl？

Question

我创建了一个管道

看起来像这样

import { Pipe, PipeTransform } from '@angular/core';
import { DomSanitizer } from '@angular/platform-browser';

@Pipe({
  name: 'SafeUrl'
})
export class SafeUrlPipe implements PipeTransform {

  constructor(private domSanitizer: DomSanitizer) {}
  transform(url: any) {
    return this.domSanitizer.bypassSecurityTrustResourceUrl(url);
  }

}

当我在 HTML

中使用它时

<td><a [href]="'callto:{{item.email}}' | SafeUrlPipe">{{item.email}}</a></td>

我已经把它添加到我的 app.module.ts 并将其导入到我正在使用的 ts（页面）上。

我正在使用 Angular 13

Answer 1

要使管道正常工作，必须将其放在插值大括号内：

{{item.email | SafeUrlPipe }}

如何在 Angular 中将其设为 SafeUrl？

How do I make this a SafeUrl in Angular?

typescript

angular-pipe

angular