Master da Web
Volver al Blog

Angular JS: Cómo mostrar una variable String en HTML

Lucas6 de noviembre de 20161 min de lecturaActualizado el 4 de noviembre de 2023
Angular JS: Cómo mostrar una variable String en HTML

Antes de la versión 1.2 de Angular JS era posible utilizar la siguiente directiva:

<p ng-bind-html-unsafe="chamado.descricao"></p>

Sin embargo, esta directiva se eliminó en versiones posteriores por motivos de seguridad.

¿Cómo mostrar una variable en HTML sin escapar etiquetas?

1 – En tu Controlador pasa las variables $scope y $sce.

var MeuCtrl = function($scope, $sce) {

}

2 – Crearemos una función que se utilizará en la Vista para permitir que una Cadena se muestre en HTML:

var MeuCtrl = function($scope, $sce) {
    $scope.chamados = [{id: "1", descricao:"<b>blog.masterdaweb.com</b>"}]
    $scope.trustAsHtml = function(string) {
         return $sce.trustAsHtml(string);
    };
}

3 – Entonces la Vista se ve así:

<li ng-repeat="chamado in chamados">
    <p data-ng-bind-html="trustAsHtml(chamado.descricao)"></p>
</li>

El objeto «called.description» que contiene el HTML se pasa a la función«$sce.trustAsHtml()«, que permite mostrar HTML en la Vista.

Compartir

¿Necesita Hosting o Servidores?

Conozca nuestras soluciones en VPS, servidores dedicados y hosting profesional

Artículos Relacionados

Ver todos los artículos