首页 文章

iframe不会停止在Angular循环中重新加载

提问于
浏览 次
3

我正在论坛页面的评论部分，我使用tinyMCE来提供内容 . 添加到数据库后，内容或注释将在预先存在的注释对象的循环（* ngFor）中异步添加 . 内容由innerHTML属性呈现，该属性调用返回已解码的html内容的方法 .

HTML代码：

<div [innerHTML]="trustContent(comment)">

方法返回：

this.sanitizer.bypassSecurityTrustHtml(content);

但问题是每次我添加或嵌入媒体（iframe）时，例如youtube视频使用编辑器，所有视频/ iframe闪烁并无休止地重新加载 . 任何想法，建议和解决方案都受到欢迎和赞赏！谢谢 ：）

angular iframe

2 回答

  • 3

    经过这么长时间你必须找到解决方案，但我会按照我解决的方式来写 .

    我遇到了你描述的同样的问题，在我的例子中，我解决它的方法是将字符串的值保存在字符串中而不是使用函数 .

    所以没有

    <div [innerHTML]="trustContent(comment)">

    我用了

    <div [innerHTML]="safeContent">

    在component.ts中

    safeContent =  this.sanitizer.bypassSecurityTrustHtml(content);

    这阻止了我的无限循环

    回复于
  • 3

    首先，为迟到的帖子道歉 . 过去几周一直很忙，到目前为止我没有时间发布我的答案 . 无论如何......为了那些可能遇到同样问题的人的利益，对我有用的是通过使用管道 . 所以我创建了一个简单的自定义管道，它可以转换给定的内容并返回一个安全可信的html .

    The Pipe:

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


@Pipe({ name: 'safe_html' })
export class SafeHtmlPipe implements PipeTransform {
  constructor(private sanitizer: DomSanitizer) {}
  transform(content) {
    return this.sanitizer.bypassSecurityTrustHtml(content);
  }
}

    然后在视图上，内容/注释呈现为

    <div [innerHTML]="comment.content  | safe_html"></div>

    重申一下，评论是在一个循环中输出的 .

    回复于

相关问题