17

I'm using AngularJS with a third party service that generates html responses. I want to use ng-repeat to render the HTML responses as a list, however Angular renders it as text.

Is it possible to use ng-repeat to render HTML property?

I've created this jsFiddle to demonstrate my issue. http://jsfiddle.net/DrtNc/1/

1
  • 1
    For those of you viewing this question now, check out the top comment on the docs for ngBindHtml. That worked for me while these answers did not.
    – Gaʀʀʏ
    Commented Nov 20, 2013 at 22:37

3 Answers 3

20

I think using ng-bind-html-unsafe will get you what you need.

<div ng:repeat="item in items" ng-bind-html-unsafe="item.html"></div>

Here's a working fiddle: http://jsfiddle.net/nfreitas/aHfAp/

Documentation for the directive can be found here: http://docs.angularjs.org/api/ng.directive:ngBindHtmlUnsafe

3
  • 1
    what if I would like to have custom directives used in item.html?
    – test30
    Commented Aug 7, 2014 at 11:26
  • 6
    This is a couple of years old -- just wanted to inform new traffic that this method has been deprecated. Here is a good way to do it: stackoverflow.com/questions/19415394/… Commented May 25, 2015 at 21:50
  • Deprecated, use Matt Saunders' answer below Commented Nov 19, 2015 at 11:33
17

The way I achieved this is by ng-bind-html inside the ng-repeat;

<div ng-repeat="comment in comments">
  <div ng-bind-html="comment.content"></div>
</div>

Hope this helps someone!

1
2

item.html will always be interpreted as text. you have to convert it to html explicitly. click here

I have added a render function which will convert each string to html.

2
  • 3
    mmm ... I think it was too early to celebrate. your solution renders the innerHTML, what I really need is to render the entire HTML. see my update :jsfiddle.net/DrtNc/4 Commented Jul 10, 2012 at 9:59
  • this doesnt work with nested tags or if you have some part of the text out of the tags
    – Xsmael
    Commented Oct 3, 2017 at 11:06

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.