Как отобразить или любой необработанный html в данных angular?
Как я могу отображать
как пробел, а не как строку. Есть ли фильтр raw
, как в пруте?
<div>{{item}}</div>
$scope.item = ' ';
Но результат экранирован &nbsp;
. Мне нужно это, потому что ' '
имеет высоту 0.
Ответы
Ответ 1
Это можно легко сделать, используя ngBindHtml
Для Angular выше версия 1.2.x:
использовать ng-bind-html
Рабочий демонстрационный пример
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 Is Your Name?';
});
Для Angular версии 1.0.x:
Рабочий демонстрационный пример
использовать 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 Is Your Name?';
});
Ответ 2
Для Angular версии 1.3.x:
Используйте службу $sce
, чтобы пометить строку как безопасную для использования в определенном контексте (HTML в этом случае).
См. Документацию здесь
Код HTML:
<div ng-app='myApp' ng-controller="Controller">
<div ng-bind-html="item"></div>
</div>
JS-код (контроллер):
var app = angular.module('myApp', []);
app.controller('Controller', function ($scope, $sce) {
$scope.item = $sce.trustAsHtml('<span>Some HTML code</span>');
});
Ответ 3
Попробуйте использовать ngBindHtml
<div data-ng-bind-html="item"></div>
Ответ 4
Вы также можете создать фильтр для этого.
Фильтр
app.filter("trustHtmlContent", ['$sce', $sce => htmlCode => $sce.trustAsHtml(htmlCode)]);
usage
использования
<ANY ng-bind-html="value | trustHtmlContent"></ANY>
src: Как использовать $ sce.trustAsHtml(string) для репликации ng-bind-html-unsafe в Angular 1. 2+
Ответ 5
Вы можете использовать код ascii для & nbsp в строке.
Alt-255.
Это будет правильно отображаться как & nbsp.