Comment rendre une balise HTML de valeur json en utilisant angularJs

//json, c'est comme cela

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

//HTML

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

//Sortie

Preamble : <p>test<\/p>

mais comment rendre cette balise et l'afficher à l'aide angulaire ?

//Sortie devrait ressembler à ceci

 Preamble : test

OriginalL'auteur Flash | 2015-07-10

  1. 20

    Au lieu de passer la chaîne à afficher directement, vous devez utiliser sce.trustAsHtml pour pré-traiter le html.

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

    Puis dans votre modèle de vue, l'utilisation ng-bind-html gérer html de liaison.

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

    Comme vous l'avez mentionné, vous avez un tableau d'objet, il n'est pas facile de les jeter dans votre contrôleur, vous pouvez lier $sce à votre $scope alors appel trustAsHtml de votre point de vue

    Dans votre contrôleur

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

    Puis dans votre mode html

    <div>Preamble {{$index+1}} : <span ng-bind-html="$sce.trustAsHtml(item1.Preamble._unparsedString)"></span></div>
    vous pouvez voir cet exemple jsfiddle.net/1joo0j77/4
    je vais avoir du tableau d'objets..donc comment l'appliquer bcoz ce n'est pas une valeur unique..et j'ai d'appliquer à l'intérieur d'une ng-repeat
    découvrez ma mise à jour. Vous pouvez simplement injecter $sce dans votre contrôleur.
    pouvez-vous modifier à l'intérieur de jsfiddle.net/1joo0j77/4
    voir jsfiddle.net/1joo0j77/5 exécuter le projet, choisir les "Marchés" dans la seconde boîte de sélection. Vous pouvez voir le résultat.

    OriginalL'auteur Rebornix

  2. 5

    Veuillez vérifier ce travail exemple: http://jsfiddle.net/Shital_D/b9qtj56p/6/

    Téléchargement de fichier angular-sanitize.js et l'inclure dans votre application.

    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>

    Il a Travaillé , Mais ce qui est différent entre angular_js et angular-sanitize.js

    OriginalL'auteur User2