Angular HTML binding

angular angular2-template angular2-databinding
Aviad P. picture Aviad P. · Jul 21, 2015 · Viewed 563.8k times · Source

I am writing an Angular application and I have an HTML response I want to display.

How do I do that? If I simply use the binding syntax {{myVal}} it encodes all HTML characters (of course).

I need somehow to bind the innerHTML of a div to the variable value.

Answer

prolink007 picture prolink007 · Dec 22, 2015

The correct syntax is the following:

<div [innerHTML]="theHtmlString"></div>

Documentation Reference

Related questions

OrderBy pipe issue

I'm not able to translate this code from Angualr 1 to Angular 2: ng-repeat="todo in todos | orderBy: 'completed'" This is what i've done following the Thierry Templier's answer: Component template: *ngFor="#todo of todos | sort" Component code: @Component({ selector: 'my-app', templateUrl: "./…

Read More
Angular2 disable button

I know that in angular2 I can disable a button with the [disable] attribute, for example: <button [disabled]="!isValid" (click)="onConfirm()">Confirm</button> but can I do it using [ngClass] or [ngStyle] ? Like so: <button […

Read More
Angular2 *ngIf check object array length in template

Refered to https://angular.io/docs/ts/latest/guide/displaying-data.html and stack How to check empty object in angular 2 template using *ngIf still getting syntax error self context undefined. If I remove *ngIf condition then I am getting values …

Read More