1

I loop an observable that contains information about the content of my article but when I use innerHtml, I still have the HTML tags that appear.

<div *ngFor="let article of informationsArticle|async;">

      <p [innerHTML]="article.contenu_part1" *ngIf="article.contenu_part1"></p>

</div>

enter image description here

I do not understand why because it seems correct..

Does not work with DomSanitizer :

keep-html.pipe.ts :

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

@Pipe({ name: 'keepHtml', pure: false })
export class EscapeHtmlPipe implements PipeTransform {
  constructor(private sanitizer: DomSanitizer) {
  }

  transform(content) {
    return this.sanitizer.bypassSecurityTrustHtml(content);
  }
}

contenu-article.html :

<div *ngFor="let article of informationsArticle|async;">

      <p [innerHTML]="article.contenu_part1 | keepHtml" *ngIf="article.contenu_part1"></p>

</div>

I added EscapeHtmlPipe in "declarations" of app.module.ts file with the import.

Valentin Harrang
  • 1,081
  • 2
  • 17
  • 34

0 Answers0