0

I take comments from users for an image which is displayed in my website by using a WYSIWYG editor (rich text editor). The ng-modal of this text editor returns the texts with HTML tags as well. For example:

<u><b><i>test1</i></b></u>

Currently, I store them in the database as varchar. But when I display these HTML contents on the front-end again after fetching them from the database, it displays as plain text instead of as HTML elements.

Is there any other datatype which can store HTML elements as HTML objects in the database other than varchar?

How can I output an HTML object from a string type angular (JavaScript) variable which contains HTML elements?

  • 2
    text, longtext, blob. – Anthony Mar 01 '18 at 19:58
  • 2
    Bug odds are good it isn't an issue with how it is stored in the database, but with how you are outputting it to the browser. – Anthony Mar 01 '18 at 20:00
  • yes Anthony is there any way to output a HTML object from a string type angular(java script) variable which contains HTML elements? –  Mar 01 '18 at 20:03
  • It sounds to me like the text is getting escaped as you're sending it to be displayed. I'm not familiar with angular to know where that escaping would be happening, but you either could either unescape the text, or store just the text and inject it into the html. If your html is always the same for all comments, that is what I would recommend as processing unescaped user input is always a risk – JustWannaFly Mar 01 '18 at 20:07
  • 1
    If this is about AngularJS 1.x please replace the `angular` tag with the `angularjs` tag. If this is actually Angular 2,3,4,5 it is a duplicate of https://stackoverflow.com/a/41089093/217408 – Günter Zöchbauer Mar 01 '18 at 20:09
  • 'store just the text and inject it into the html' was done and then the error was occoured –  Mar 01 '18 at 20:20

1 Answers1

1

From what i understood, what you really want is to output your saved text as html, and for that, since you are using angular, you can use ng-bind-html:

  <div ng-controller="ExampleController">
 <p ng-bind-html="myHTML"></p>
</div>

For more information on ng-bind-html go here: https://docs.angularjs.org/api/ng/directive/ngBindHtml

Other notes: Don't forget to $sanitize

c0utinh0
  • 179
  • 1
  • 8