Décoder l'entité HTML en JS angulaire

Comment puis-je décoder une entité HTML dans un texte en utilisant angular JS.

j'ai la chaîne

""12.10 On-Going Submission of ""Made Up"" Samples.""

j'ai besoin d'un moyen de décoder ceci en utilisant Angular JS. J'ai trouvé un moyen de le faire en utilisant javascript ici mais je suis sûr que cela ne fonctionnera pas pour Angular. Besoin de récupérer la chaîne originale sur L'UI qui ressemblerait à

""12.10 On-Going Submission of ""Made Up"" Samples.""
23
demandé sur Community 2014-09-26 20:38:21

3 réponses

vous pouvez utiliser le ng-bind-html directive pour l'afficher comme un contenu html avec toutes les entités html décodées. Assurez-vous juste d'inclure le ngSanitize dépendance dans votre application.

DÉMO

JAVASCRIPT

angular.module('app', ['ngSanitize'])

  .controller('Ctrl', function($scope) {
    $scope.html = '"12.10 On-Going Submission of ""Made Up"" Samples."';
  });

HTML

  <body ng-controller="Ctrl">
    <div ng-bind-html="html"></div>
  </body>
41
répondu ryeballar 2015-01-14 02:23:50

si vous ne voulez pas utiliser ngSanitize, vous pouvez le faire de cette façon:

dans votre contrôleur:

$scope.html = '&quot;12.10 On-Going Submission of &quot;&quot;Made Up&quot;&quot; Samples.&quot;'
$scope.renderHTML = function(html_code)
        {
            var decoded = angular.element('<textarea />').html(html_code).text();
            return $sce.trustAsHtml(decoded);
        };

et dans le modèle:

<div ng-bind-html="renderHTML(html)"></div>

assurez-vous d'injecter $sce dans votre contrôleur""

23
répondu Frane Poljak 2015-04-07 13:59:22

j'ai un problème similaire, mais je n'ai pas besoin d'utiliser la valeur de résultat sur L'UI. Ce problème a été résolu par le code du module ngSanitize angulaire:

var hiddenPre=document.createElement("pre");
/**
* decodes all entities into regular string
* @param value
* @returns {string} A string with decoded entities.
*/
function decodeEntities(value) {
  if (!value) { return ''; }
    
  hiddenPre.innerHTML = value.replace(/</g,"&lt;");
  // innerText depends on styling as it doesn't display hidden elements.
  // Therefore, it's better to use textContent not to cause unnecessary reflows.
  return hiddenPre.textContent;
}


var encoded = '&lt;p&gt;name&lt;/p&gt;&lt;p&gt;&lt;span style="font-size:xx-small;"&gt;ajde&lt;/span&gt;&lt;/p&gt;&lt;p&gt;&lt;em&gt;da&lt;/em&gt;&lt;/p&gt;';
var decoded = decodeEntities(encoded);

document.getElementById("encoded").innerText=encoded;
document.getElementById("decoded").innerText=decoded;
#encoded {
  color: green;
}

#decoded {
  color: red;
}
Encoded: <br/>
<div id="encoded">
</div>

<br/>
<br/>

Decoded: <br/>
<div id="decoded">
</div>
1
répondu sody 2015-08-19 14:17:32