iframe 在 kolkov 角度编辑器中不起作用

问题描述

Kolkov 角度编辑器不支持 Iframe。

包装：https://www.npmjs.com/package/@kolkov/angular-editor

在编辑器中，它看起来工作正常，但前面板没有显示任何内容

解决方法

为此，您需要在角度编辑器配置中进行更改： 您需要设置 sanitize: false。

config: AngularEditorConfig = {
    sanitize: false,.........................
  };

由于 senetize:false chrome 在前端给你一个错误，如下所示：

警告：清理 HTML 会删除一些内容（请参阅 http://g.co/ng/security#xss）。

您可以通过创建用于清理 HTML 的自定义管道来修复此错误：

sanitize-html.pipe.ts

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

@Pipe({
  name: 'sanitizeHtml'
})
export class SanitizeHtmlPipe implements PipeTransform {

  constructor(private _sanitizer: DomSanitizer) {
  }

  transform(v: string): SafeHtml {
    return this._sanitizer.bypassSecurityTrustHtml(v);
  }
}

在 HTML 中

<p *ngIf="appMessageData" [innerHTML]="appMessage | sanitizeHtml"></p>

这会帮助你:)