Skip to content
Advertisement

How to display   or any raw html in angular data?

How can I display   as space not as string. Is there raw filter like in twig?

<div>{{item}}</div>

$scope.item = '&nbsp;';

But the result is escaped &amp;nbsp;. I need this because ' ' have height of 0.

Advertisement

Answer

It can be easily done by using ngBindHtml

For Angular above 1.2.x version:

use ng-bind-html

Working Demo

html

<div ng-app='myApp' ng-controller="Controller">
   <div ng-bind-html="item"></div>
</div>

script

var app = angular.module('myApp', ['ngSanitize']);
app.controller('Controller', function ($scope, $sce) {
   $scope.item = 'What&nbsp;Is&nbsp;Your&nbsp;Name?';
});

For Angular 1.0.x version:

Working Demo

use ng-bind-html-unsafe

html

<div ng-app='myApp' ng-controller="Controller">
   <div ng-bind-html-unsafe="item"></div>
</div>

script

var app = angular.module('myApp', []);
app.controller('Controller', function ($scope) {
   $scope.item = 'What&nbsp;Is&nbsp;Your&nbsp;Name?';
});
Advertisement