FX_Sektor
FX_Sektor

Reputation: 1460

how to allow to show html in my div | Angular 7

I have text-editor form "ngx-editor": "^4.1.0".In result of typing I have for example this.

<div style="text-align: center;"><span style="background-color: transparent;">awd d awd awd</span></div><div style="text-align: center;"><span style="background-color: transparent;"><br></span></div><div style="text-align: left;"><span style="background-color: transparent;">ewfewfsefsefe</span></div>

but when I want to display the result of editor I use elementary {{mytext}} But I have my saved html which was generate by text editor such text http://prntscr.com/p337qz

[innerHTML] show me only text without html element.

How I can show it with all html styles and element?

Upvotes: 1

Views: 923

Answers (1)

ahmeticat
ahmeticat

Reputation: 1939

You can use bypassSecurityTrustHtml

import { DomSanitizer } from '@angular/platform-browser'

@Pipe({ name: 'safeHtml'})
export class SafeHtmlPipe implements PipeTransform  {
  constructor(private sanitized: DomSanitizer) {}
  transform(value) {
    return this.sanitized.bypassSecurityTrustHtml(value);
  }
}

After that set your html

<div [innerHtml]="myText | safeHtml"></div>

Please examine example

Upvotes: 2

Related Questions