Angular 2: sanitizing HTML stripped some content with div id - this is bug or feature?

ktretyak picture ktretyak · Sep 24, 2016 · Viewed 44.3k times · Source

I use <div [innerHTML]="body"></div> to pass unescaped HTML to my template, and when I pass to body div with attribute id, Angular throw:

WARNING: sanitizing HTML stripped some content (see http://g.co/ng/security#xss). WARNING: sanitizing HTML stripped some content (see http://g.co/ng/security#xss). WARNING: sanitizing HTML stripped some content (see http://g.co/ng/security#xss).

See. plunker

So why it says this? What can be dangerous id in div? Could this bug?

Answer

Md Ayub Ali Sarker picture Md Ayub Ali Sarker · Dec 3, 2016

Simple solution is to write pipe like

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

add in your html file add pile like

  <td *ngIf="i>0" [innerHTML]="entry.attributes[i] | sanitizeHtml"></td>