title: AngularJs: How to decode HTML entities in HTML?
body: <p><strong>THE SITUATION:</strong></p>
  
  <p>I am bulding a webpage which content is taken calling an API that returns the data in json format.</p>
  
  <p>The problem is that the html tags are given as HTML entities, that has to be decoded.</p>
  
  <p><strong>EXAMPLE:</strong></p>
  
  <p>This is example of the json i am dealing with:</p>
  
  <pre><code>&amp;#60;p align=&amp;#34;justify&amp;#34;&amp;#62;&amp;#60;strong&amp;#62;15&amp;#60;sup&amp;#62;th&amp;#60;/sup&amp;#62; HERE THERE IS A BOLD TEXT &amp;#60;/strong&amp;#62; HERE SOME NORMAL TEXT...
  </code></pre>
  
  <p><strong>ATTEMPT:</strong></p>
  
  <p>I have spend time research it and it seems harder than i thought. Looking in google and similar SO question, a possible solution is to use the ng-bing-html</p>
  
  <p>Api call:</p>
  
  <pre><code>$http.get('http://API/page_content').then(function(resp) 
  {
      $scope.content_test = resp.data[0].content; 
  }
  </code></pre>
  
  <p>Filter:</p>
  
  <pre><code>.filter('trusted', ['$sce', function($sce){
      return function(text) {
          return $sce.trustAsHtml(text);
      };
  }])
  </code></pre>
  
  <p>Ng-bind-html in the angular view:</p>
  
  <pre><code>&lt;div ng-bind-html=" content_test  | trusted"&gt;&lt;/div&gt;
  </code></pre>
  
  <p><strong>OUTPUT:</strong></p>
  
  <p>This is the output in the view (exactly as you see it):</p>
  
  <pre><code>&lt;p align="justify"&gt;&lt;strong&gt;15&lt;sup&gt;th&lt;\/sup&gt; HERE THERE IS A BOLD TEXT&lt;\/strong&gt; HERE SOME NORMAL TEXT...
  </code></pre>
  
  <p>but what i need to see is the text properly formatted:</p>
  
  <p><strong>HERE THERE IS A BOLD TEXT</strong> HERE SOME NORMAL TEXT...</p>
  
  <p><strong>THE QUESTION:</strong></p>
  
  <p>How can i decode HTML entities in a proper formatted HTML in AngularJs?</p>