javascript - How to render block of 'escaped' HTML returned in JSON response -
i'm beginner programmer trying make simple meteor app whereby can display data site of mine through rest api (the site runs on joomla , i'm using jbackend rest api - context , doesn't apply question)
when send request , receive response, json returned gives me content of article huge html block -
{ "status": "ok", "id": "23", "title": "the ivy", "alias": "the-ivy2", "featured": "0", "content": "<div class=\"venue-intro\">\r\n\t<h1>\r\n\t\t\t\t\t<a href=\"index.php?option=com_content&view=article&id=23:the-ivy2&catid=14:leisure-activites\" title=\"the ivy\">\r\n\t\t\t\t\tthe ivy\r\n\t\t\t\t\t</a>\r\n\t\t\t</h1>\r\n\r\n\t<div class=\"row\">\r\n\t\t<div class=\"col-md-5\">\r\n\t\t\t\t\t\t\t<div class=\"venue-intro-img\">\r\n\t\t\t\t\t\t\t\t\t\t\t<a href=\"index.php?option=com_content&view=article&id=23:the-ivy2&catid=14:leisure-activites\" title=\"the ivy\">\r\n\t\t\t\t\t\t\t\t\t\t\t<img src=\"http://localhost/stc/images/stories/com_form2content/p4/f20/thumbs/theivy.jpg\">\r\n\t\t\t\t\t\t\t\t\t\t\t</a>\r\n\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t</div>\r\n\t\t<div class=\"col-md-7\">\r\n\t\t\t\t\t\t\t<p><p>the ivy situated in heart of london's west end, close leicester square, shaftsbury avenue , vibrant quarters of covent garden , soho. open late each night, restaurant is...</p>\r\n\t\t\t\t\t</div>\r\n\t</div>\r\n</div><div class=\"venue-main\">\r\n<h1>the ivy</h1>\r\n\t<img src=\"http://localhost/stc/images/stories/com_form2content/p4/f20/theivy.jpg\" class=\"venue-main-img\">\r\n\t<p><p>the ivy situated in heart of london's west end, close leicester square, shaftsbury avenue , vibrant quarters of covent garden , soho. open late each night, restaurant perfect post theatre dinner. royal opera house, coliseum , other theatres short walk away. space can arranged , dressed suit event- whatever style , can accommodate 25-120 people.</p>\r\n<p>the room comes baby grand piano, fresh flowers, candles , place cards. av equipment , musicians can arranged , our event production company, urban caprice, can re-design , style room event, supplying props, lighting , more. create seasonal menus private room, let know if have other favourite dishes , we'd love try , include them.</p>\r\n<p><a href=\"http://www.the-ivy.co.uk/\" target=\"_blank\">http://www.the-ivy.co.uk/</a></p></p>\r\n</div>" }
i trying render block on app, can't manage - here's i've been trying far -
template.articles.helpers({ 'content': function() { return $('<div />').html(this.content).text(); } });
using method gives me output -
<div class="venue-intro"> <h1> <a href="index.php?option=com_content&view=article&id=23:the-ivy2&catid=14:leisure-activites" title="the ivy"> ivy </a> </h1> <div class="row"> <div class="col-md-5"> <div class="venue-intro-img"> <a href="index.php?option=com_content&view=article&id=23:the-ivy2&catid=14:leisure-activites" title="the ivy"> <img src="http://localhost/stc/images/stories/com_form2content/p4/f20/thumbs/theivy.jpg"> </a> </div> </div> <div class="col-md-7"> <p></p><p>the ivy situated in heart of london's west end, close leicester square, shaftsbury avenue , vibrant quarters of covent garden , soho. open late each night, restaurant is...</p> </div> </div> </div><div class="venue-main"> <h1>the ivy</h1> <img src="http://localhost/stc/images/stories/com_form2content/p4/f20/theivy.jpg" class="venue-main-img"> <p></p><p>the ivy situated in heart of london's west end, close leicester square, shaftsbury avenue , vibrant quarters of covent garden , soho. open late each night, restaurant perfect post theatre dinner. royal opera house, coliseum , other theatres short walk away. space can arranged , dressed suit event- whatever style , can accommodate 25-120 people.</p> <p>the room comes baby grand piano, fresh flowers, candles , place cards. av equipment , musicians can arranged , our event production company, urban caprice, can re-design , style room event, supplying props, lighting , more. create seasonal menus private room, let know if have other favourite dishes , we'd love try , include them.</p> <p><a href="http://www.the-ivy.co.uk/" target="_blank">http://www.the-ivy.co.uk/</a></p><p></p> </div>
that looks valid html yet problem browser isn't rendering such - outputs long string literally. :(
at end of day, i'd able render html i'm receiving in json response.
any appreciated.
blaze has way render raw html strings using triple curly braces instead of normal two.
having
{{{content}}}
in template should render content, provided helper returns valid html.
be very careful when using it, if contains user-generated content.
Comments
Post a Comment