I'm trying to display some text that is stored in a json data file. Since the text needs some basic formatting such as p tags I have coded them into the text as so:
[ { "htmlText": "<p>Here is some formatted text</p><p>This will be another para</p>" } ]
As I am using IONIC I have the following set up
//Add the ngSanitize
angular.module('starter', ['ionic', 'ngSanitize'])
.controller('StuffController', ['$scope', '$state', '$http', function($scope, $state, $http) {
$http.get('data/stuff.json').success(function(data){
//function to pass the text with html coding
$scope.sanitizeMe = function(text) {
return $sce.trustAsHtml(text)
};
$scope.stuff = data;
});
}])
And I am using it in my template as so
<div class="card" ng-repeat="text in stuff">
<div ng-bind-html="sanitizeMe(text.htmlText)"></div>
</div>
As far as I can tell this should produce appropriately formatted text, however all I get is
<p>Here is some formatted text</p>This will be another para</p>
As can be seen the ng-bind-html is not working. I've checked many posts and all suggest that this should work. What am I doing wrong? Can anyone solve this for me?
