CODEWITHSUNDEEP
javascripthtmlangular
Shadow
Shadow

Reputation: 4792

Angular build result destroys html entities, how to prevent this from happening

Currently using Angular 4+ and recently found a problem. When using an html entity in development mode and doing npm start the respective symbol shows up correctly. However, when I build the app and open it, the html entity gets converted to something else, essentially breaking the entity completely.

The entity is the down triangle ▼ or ▼ but in the built app the resulting entity becomes this piece of html code â–¼. It is being placed directly inside the template of a component, there are no methods associated with it, it is as if it was written in the html file.

I have tried to find a way to prevent this from happening but the Angular documentation is an absolute nightmare when trying to find a solution for this and due to the terrible fragmented documentation related to each version on the web I was not able to find anything that allowed me to fix this problem.

How can I keep the html entities intact when I build the angular app?

Upvotes: 0

Views: 463

Answers (1)

Shadow
Shadow

Reputation: 4792

I finally found out why this is happening and it has nothing to do with Angular. The local server that I am using is serving the html with an encoding of ISO-8859-1 instead of UTF-8. Even after adding the meta tag inside the html file, the incorrect encoding prevails. The solution will be to make the server serve the document with the correct encoding.

EDIT: And yes, I made sure to check if the file itself was being saved with UTF-8 encoding.

Upvotes: 1

Related Questions