current community

your communities

more stack exchange communities

Stack Exchange
tour help
careers 2.0
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 0 down vote favorite

i am trying to make a blog page with angularJS and on the message part i have a div like this.

<div class="post-content">
    {{jsonPost.message}}
</div>

and inside the variable jsonPost.message i got a string like this 

<p>paragraph 1</p>
<p>paragraph 2</p>

but instead creating 2 html paragraphs, instead i see the <p> texts on the screen aswell like a text. Is there a way to make them html code ? and than target them via css. Thank you, Daniel!

share|improve this question
    
Have you tried using ngBindHtmlUnsafe? Take a look at this, I haven't used it yet so I am not posting it as an answer. docs-angularjs-org-dev.appspot.com/api/… –  Naveed Sep 12 '13 at 18:40
add comment

2 Answers

up vote 2 down vote

Since you are using v1.2, you need to use ng-bind-html. To bypass sanitization use $sce service:

$scope.jsonPost.message = $sce.trustAsHtml("<p>paragraph 1</p>");

HTML:

<!-- bypasses sanitizaton -->
<div data-ng-bind-html="jsonPost.message"></div>
share|improve this answer
add comment
up vote 1 down vote

You can use ng-bind-html-unsafe:

<div class="post-content" ng-bind-html-unsafe="jsonPost.message"></div>
share|improve this answer
2  
Note: this will not work in Angular 1.2+ It has been replaced with Strict Contextual Escaping. See docs.angularjs.org/api/ng.$sce –  TheSharpieOne Sep 12 '13 at 18:45
    
i am using v1.2 –  Pacuraru Daniel Sep 12 '13 at 19:23
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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