faiz
faiz

Reputation: 123

ionic html data binding from database

i have this html in my database.

<p>my data here. <b>bold a bit</b></p>

the database from factory like this

.factory('DataSingle', function($http, $q){
  var sContent = function(idc){
    var deferred = $q.defer();
    $http.get('http://mydomainrestserver/'+idc)
    .success(function(data, status, headers, config){
     deferred.resolve(data);
    });
     return deferred.promise;
  }
 return { sContent : sContent }
})

this is my controller

.controller('SingleCtrl', function($scope, $http, DataSingle, $stateParams){
 var single_id = $stateParams.ids;
 DataSingle.sContent(single_id).then(

 function(single){
  $scope.singledata = single;
   }
})

singe the data is from database. it render as text instead of rendering it with paragraph and bold text.

what i get is just plain test from the view

Title: Single page
Data: <p>my data here. <b>bold a bit</b></p>

the data is successfully received but not rendered properly on my device. the question is, how to render the html from the result of query to ionic content view?

Upvotes: 2

Views: 3610

Answers (2)

Michał Miszczyszyn
Michał Miszczyszyn

Reputation: 12711

Obviously all text content is escaped for security reasons unless you explicitely mark it as safe using the $sce service. So what you should do is: 

$scope.singledata = $sce.trustAsHtml(single);

https://docs.angularjs.org/api/ng/service/$sce

Upvotes: 1

Muhammad Ahsan Ayaz
Muhammad Ahsan Ayaz

Reputation: 1947

in factory

$scope.singledata = $sce.trustAsHtml(single);

in html

<span ng-bind-html="singledata" class="htmlComment"></span>

Upvotes: 4

Related Questions