AngularJS not reading html tag in interpolation

Question

I am using AngularJS v1.7.9

In my database I have person name value stored as <i>FirstName</i> Last Name When I use this value using interpolation as {{person.name}} I see it as <i>Alexandra</i> Golfi

Why AngularJS can not read the html tag? is there a way I can still display first name in italic style while storing first name and last name in the same data base column

Thank you

Answer 1

The ng-bind-html directive is a secure way of binding content to an HTML element.

When you are letting AngularJS write HTML in your application, you should check the HTML for dangerous code. By including the "angular-sanitize.js" module in your application you can do so by running the HTML code through the ngSanitize function. syntax:

<element ng-bind-html="expression"></element>

Example:

<span ng-bind-html="person.name"></span>

Reference:

https://docs.angularjs.org/api/ng/directive/ngBindHtml

https://www.w3schools.com/angular/ng_ng-bind-html.asp