Отображение html через угловой

-1

Я пытаюсь показать html, который был закодирован. но это, похоже, не работает. вход через:Отображение html через угловой

&lt;h1&gt;Some header&lt;/h1&gt;

и это показывает:

<h1> Некоторые заголовок </h1 >

Но я хочу, чтобы сделать HTML; но как показано в следующем ручке; это просто показать источник HTML

это мой текущий контроллер:

var myApp = angular.module('myApp', ['ngSanitize']); 

myApp.controller('myCtrl', function ($scope, $sce) { 
    $scope.trustedHtml = $sce.trustAsHtml('&lt;h1&gt;Some header&lt;/h1&gt;'); 
});

со следующей HTML:

<div ng-app="myApp" ng-controller="myCtrl"> 
    <div ng-bind-html="trustedHtml"></div> 
</div>

http://codepen.io/cskiwi/pen/PqXdOa

источник

2015-08-03 Kiwi

Затем декодируйте html и установите его для привязанного свойства ... В чем проблема? – Engineer

@Engineer, тогда мой вопрос заключается в том, как его декодировать – Kiwi

Не могли бы вы отправить код, а также ссылку на код? У всех не будет времени на просмотр веб-страниц, и вы получите больше ответа. Я считаю, –

Для декодирования HTML, вы можете использовать этот трюк:

var encodedHtml = '&lt;h1&gt;Some header&lt;/h1&gt;'; 
var decodedHtml = angular.element('<div>').html(encodedHtml).text();

Затем применить к собственности:

$scope.trustedHtml = $sce.trustAsHtml(decodedHtml);

источник

2015-08-03 11:25:35 Engineer

Я нашел что-то подобное, но не странно, что вам нужно создать div, чтобы показать html? – Kiwi

@ Киви Нет, это не так. В противном случае вам нужно использовать метод 'String.replace'. И возьмите все специальные символы, например '&', '<' и т. Д. – Engineer

Правда, но это, похоже, отлично работает. благодаря! – Kiwi

-1

Проверить это codepen пожалуйста http://codepen.io/anon/pen/xGmaWR

Angular Docs

источник

2015-08-03 11:21:57 JcDenton86

, что не отвечает на мой вопрос, это просто говорит, что здесь рабочий пример другого ввода .... – Kiwi

В вашем вопросе говорится «отображение html через угловое», и мой ответ делает именно это. И в вашем теле вы говорите «Я хочу отобразить html» – JcDenton86

Это мое название действительно, тогда в самом вопросе я объясню, что такое мой вход и что я хочу. Итак, мой заголовок подсказывает, что говорят вопросы ... – Kiwi

Вы должны дезинфицировать данные HTML/строка :

У меня такая же проблема перед некоторым t IME, то я создал фильтр для этой проблемы, вы можете использовать этот фильтр, чтобы сделать дезинфицировать ваш HTML код:

app.filter("sanitize", ['$sce', function($sce) { 
    return function(htmlCode) { 
     return $sce.trustAsHtml(htmlCode); 
    } 
}]);

в HTML можно использовать так:

<div ng-bind-html="businesses.oldTimings | sanitize"></div>

businesses.oldTimings составляет $ переменная scope, имеющая описание строк или имеющих строки с тегами html, $ scope.businesses.oldTimings является частью конкретного контроллера, который вы используете для этого html.

см в снимке:

вы можете использовать limitHtml фильтр, чтобы сделать то же самое:

app.filter('limitHtml', function() { 
    return function(text, limit) { 
     var changedString = String(text).replace(/<[^>]+>/gm, ' '); 
     var length = changedString.length; 
     return changedString.length > limit ? changedString.substr(0, limit - 1) : changedString; 
    } 
});

Затем вы можете добавить Боте фильтр в вашем HTML, как, что:

<p class="first-free-para" ng-bind-html="special.description| limitHtml : special.description.length | sanitize">

Надеюсь, что это сработает для вас.

источник

2017-01-23 12:30:59

ответ

Смежные вопросы