How to parse HTML from response in Angular?

Question

I do request to server and get JSON result:

{"result" => "HTML code"}

How to parse HTML code and get table from this response?

I tried to place this code to hidden block on the page:

<div #content>HTML code here from response</div>

What next? How to parse?

Answer 1

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

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

Usage:
<div [innerHTML]="content | sanitizeHtml"></div> //Content is what you got from json

We should always santize the content to prevent any malicious activity with DOMSanitizer. So for that We can create a pipe as above and use it anywhere in app.