Html 角度6帧绑定

有一个变量存储iframe代码。 我想把它绑在一个div里，但没用

html:

<div class="top-image" [innerHTML]="yt"></div>

ts:

yt=''；

---

解决方案是什么？

您可能会收到警告，说这是不安全的HTML。这就是Angular没有在

div

中渲染它的原因

您必须

domsanize

it：

<div class="top-image" [innerHTML]="yt | safe: 'html'"></div>

这里有一个

<div class="top-image" [innerHTML]="yt | safe: 'html'"></div>

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}`);
    }
  }
}