CODEWITHSUNDEEP
angularunicode
M.N. Bug
M.N. Bug

Reputation: 253

angular2 template binding unicode

im trying to show some symbols in angular2 template. This works fine:

<div>&#xe911;</div>

This works, too:

<div>{{"&#xe911"}}</div> //colon elided

But this doesn't:

<div>{{getSymbol()}}</div>

whith 

private symbol(): string {
    //return this.access.accessLevel >= AccessLevel.expert ? "\e911" : "\e917";
    return this.access.accessLevel >= AccessLevel.expert ? "&#xe911;" : "&#xe917;";
}

Upvotes: 3

Views: 3458

Answers (1)

Poul Kruijt
Poul Kruijt

Reputation: 71891

With string interpolation, {{}} is treated as a text string. You should use innerHtml binding to get actual html in your element:

<div [innerHtml]="getSymbol()"></div>

Upvotes: 10

Related Questions