come rendere un tag HTML dal valore JSON utilizzando angularJs

Question

// JSON è come questo

"_unparsedString": "<p>test<\/p>" 

// HTML

<div>Preamble : '{{item2._unparsedString}}'</div> 

// uscita

Preamble : <p>test<\/p> 

ma come rendere quel tag e visualizzarlo usando angolare?

// output dovrebbe essere come questo

Preamble : test 

Answer 1

Invece di passare stringa da visualizzare direttamente, è necessario utilizzare sce.trustAsHtml per pre-processo del codice HTML.

$scope.bindHTML = $sce.trustAsHtml(item2._unparsedString); 

Quindi nel modello di visualizzazione, utilizzare ng-bind-html per gestire il binding html.

<div>Preamble : <div ng-bind-html="bindHTML"></div></div> 

Come lei ha ricordato di avere una serie di oggetti, non è così facile per lanciare loro nel vostro controller, è possibile associare $sce al vostro $scope quindi chiamare trustAsHtml nella vista

Così nel controller

myapp.controller('mainController', function ($scope, $http, $filter, $sce) { 
    $scope.$sce = $sce; 
... 
} 

Poi, nel tuo visualizzazione HTML

<div>Preamble {{$index+1}} : <span ng-bind-html="$sce.trustAsHtml(item1.Preamble._unparsedString)"></span></div> 

Answer 2

Controllare questo esempio operativo: http://jsfiddle.net/Shital_D/b9qtj56p/6/

Scaricare il file - angular-sanitize.js e includerlo nella propria app.

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

app.controller('myController', function($scope,$compile) { 
    $scope.html = '<p>Your html code</p>'; 
}); 

<div ng-app="myApp"> 
    <div ng-controller="myController"> 
    <p ng-bind-html="html"></p> 
</div>