HTML not rendering on Salesforce using $sce and ng-bind-html

Question

I am using Salesforce as the back end and my users can get some notifications that could contain an tag with a link to somewhere. This being said I have used $sce in the controller to do a function like this:

vm.to_trusted = to_trusted;

function to_trusted(html_code) {

    return $sce.trustAsHtml(html_code);

}

In the front end I am using it as such:

<p ng-bind-html="vm.to_trusted(message.body)"></p>

An example of the returned message.body is

<a href="/#/app/profile">Click Here to Fill out your Profile</a>.

On localhost this works awesome with the link being shown and not the tag. On Salesforce, this is not the case with the above being shown instead. Any ideas as to why this is not working?

UPDATE:

Yes I do have ngSanitize included :)

Answer 1

@dispatch will request serialize text in an odd manner in Salesforce.

In the Salesforce string, if the content is: '<a href="">Things</a>' 

In Angular, you will see that you've received: &lt;a href=&quot;$quot;&gt;Things&lt;a&gt;

Want to learn Salesforce from basics! Here's the right video for you on Salesforce provided by Intellipaat:

The solution I found is as follows which you can change in your controller:

function to_trusted(html_code) {

  // Cause the &ltg; etc become '<'

  return $('<textarea />').html(html_code).text();

}

I hope it works for you!

Want to learn Salesforce in depth? Go through the Salesforce Training provided by Intellipaat!