Direttiva ng-bind-html di AngularJS

Manuale di riferimento AngularJS

Definizione e uso

ng-bind-html Le direttive sono un metodo sicuro per legare il contenuto agli elementi HTML.

Quando permetti ad AngularJS di scrivere HTML nel tuo applicativo, dovresti controllare che non ci siano codici pericolosi nell'HTML. Incluso il modulo "angular-sanitize.js" nell'applicativo, puoi eseguire il codice HTML tramite la funzione ngSanitize per il controllo.

Esempio

Leggi l'innerHTML dell'elemento <p> e assegna al variabile myText:

<script src="https://cdn.staticfile.net/angular.js/1.6.9/angular.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular-sanitize.js"></script>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
    <p ng-bind-html="myText"></p>
</div>
<script>
var app = angular.module("myApp", ['ngSanitize']);
app.controller("myCtrl", function($scope) {
    $scope.myText = "Il mio nome è: <h1>Bill Gates</h1>";
});
</script>

Prova personalmente

Sintassi

<elemento ng-bind-html="espressione</elemento>

Tutti gli elementi HTML supportano.

Parametro

Parametro Descrizione
espressione Specificare la variabile o l'espressione da calcolare.

Manuale di riferimento AngularJS