标签: angular-dom-sanitizer

最近在我们的Angular 2应用程序中,我们添加了一个视频组件来iframe引入外部嵌入式视频.此外,我们通过利用该管道的管道清理这些资源URL DomSanitizer.问题是我们经常,但不一致,收到以下错误,嵌入的视频将无法加载:

网址细分:'null'

样品消毒管道用法:

<iframe [src]="(videoObservable$ | async)?.resourceUrl | sanitizeResourceUrl"></iframe>

管道方法本身:

transform(url: string): SafeResourceUrl {
    return this.sanitizer.bypassSecurityTrustResourceUrl(url);
}

记录url参数的值表明最初使用参数值null调用管道,然后在使用值后立即再次调用管道.

我的模拟内存数据库中有youtube链接,我想*来自youtube的这些视频.

   let videos: any[] =[
            {videoURL: "ZOd5LI4-PcM"},
            {videoURL: "d6xQTf8M51A"},
            {videoURL :"BIfvIdEJb0U"}

        ];

像这样.

我使用服务连接我的组件与服务器,现在在HTML中,我已经让v视频.在iframe中,我做到了

<iframe src=v.videoURL></iframe>

但由于它是外部来源,他们告诉我使用Domsanitzer,但我被困在这一部分.

我不知道如何清理应该循环的链接.

constructor( private sanitizer: DomSanitizer) {
    this.sanitizer.bypassSecurityTrustResourceUrl('')

< - 我不知道在这里添加什么.

我已经尝试使用DomSanitizer方法来清理以下类型的url但没有成功

C:\path\to\executable

有没有办法清理这个url用作href值？

我也用[]表示法绑定值,所以我确信它不是作为字符串插入的.

我正在尝试开发一个离子型应用程序，该应用程序将作为pwa部署，我希望将其中嵌入YouTube视频并将其显示在网格中。我的Cloud Firestore对象提供了视频链接，其标题和简短描述。

现在的问题是，当我尝试在具有单个网址的离子应用程序中使用iframe时：

<iframe width="560" height="315" src="https://www.youtube.com/embed/6kqe2ICmTxc" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>

那么它就可以了，但是当我将它绑定到数据库的Video URL时，它就不起作用了。控制台显示URL不是安全的URL。

现在，我知道可以使用DomSanitizer对其进行修复，但是我不知道如何将其用于包含所需链接的对象数组。