$sce.trustashtml Is Not Evaluating A Javascript String (or Trustasjs For That Matter);

My server has a json endpoint that returns a html/js string, looks similar to such: '\r\n\r\n

\r\n\r\n\t\t

Solution 1:

Your HTML has some syntax problem such id=\'myEditor\". I replaced it with id=\'myEditor\' and so ...

Check this jsfiddle Add angular.min.js and angular-sanitize.min.js to your project. I used jquery 2.2.4 for this sample.

HTML:

<divng-app="myApp"><divng-controller="myCtrl"><h2>{{html}}</h2><span>{{greeting}}</span><divng-bind-html="editorHtml"></div></div></div>

JS:

var myApp = angular.module('myApp', ['ngSanitize']);

var data ="\r\n\r\n<div id=\"myEditor\" name=\"myEditor\">\r\n\r\n\t\t<a href=\"http://example.com\">hi html</a>\r\n\t</div>\r\n\r\n\r\n\r\n\r\t";
var script ="<script type=\"text/javascript\"> alert('hi script');\r\n\r\n\t</"+"script>\r\n\t";

myApp.controller('myCtrl', ['$sce', '$scope' , function($sce, $scope) {
  $scope.html = data + script;
  $scope.editorHtml =$sce.trustAsHtml($scope.html);
  $scope.greeting = 'Hola!';
}]);

Solution 2:

You have to include jQuery for this to work. Also don't forget ngSanitize.

Plunker

http://plnkr.co/edit/zEXXCB459Tp25VJiyyZb?p=preview

Share