typescript - Angular 2 disable sanitize

Question

I am trying to render base64 string into <img src='data:image/png;base64,${Here}'.

But always when I try to render it, ng2 sanitizing my base64 string before rendering it adds something into my value before showing it in DOM. I have found workaround(using DomSanitizer) but it doesn't work on latest versions.

Here is my markup:

<img alt="RegularImage" src="data:image/png;base64,{{imgBase64}}">

And here is my component part:

imgBase64="SomeBase64StringFetchedSomehow";

But angular2 is showing in console next message - WARNING: sanitizing unsafe URL value

How to prevent NG2 from sanitizing my base64 string?

Update

get getImg() {
    return this._sanitizer.sanitize(SecurityContext.URL,`data:image/png;base64,${this.img}`);
}

Doesn't solve this issue. DomSanitizer class does not exists anymore in RC6

Answer 1

You need to explicitly tell Angular2 that the string is trusted

https://angular.io/docs/ts/latest/api/platform-browser/index/DomSanitizer-class.html

constructor(private sanitizer:DomSanitizer) {}

get imgBase64() {
  this.sanitizer.bypassSecurityTrustUrl('data:image/png;base64,$SomeBase64StringFetchedSomehow');
}

<img alt="RegularImage" [src]="imgBase64">

See also In RC.1 some styles can't be added using binding syntax