HTML not interpreting tags

Question

I am saving data into mysql using htmlspecialchars(). On output when getting data using htmlspecialchars_decode() before displaying it in Angular. But instead of interpreting the html code it is displaying it as a text.

Data in Database

<p class="fr-tag"><span>test</span></p>

Code being displayed after htmlspecialchars_decode()

<p class="fr-tag"><span>test</span></p>

Displaying the output from database into div as follows

<div *ngIf="product.pdescription" class="mt-2 product-description">{{product.pdescription}}</div>

I have also tried using html_entity_decode but didn't help.

Following is a screenshot of the browser

Answer 1

In order to make it working you should use innerHTML or outerHTML binding:

<div *ngIf="product.pdescription" ... [innerHTML]="product.pdescription"></div>

But beware about some limitations