Как использовать $ sce.trustAsHtml с некоторым узлом HTML

Question

Как использовать $ sce.trustAsHtml с некоторым узлом HTML

0

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

Поэтому я вижу этот ответ qaru.site/questions/20388/... который помогает мне создать html-узел из строки, затем я просматриваю каждый элемент и изменяю стили. В конце я делаю $ sce.trustAsHtml со значением innerHTML.

У меня есть этот код http://plnkr.co/edit/HUfAGR2uNMwb48rqXbkk?p=preview

<div ng-bind-html="trustedHtml"></div>

function($scope, $sce) {
  var s = '<h1 style="color: red; font-size: 16px;">Subheader</h1><p style="font-size: 12px;">text</p>';
  var div = document.createElement('div');
  div.innerHTML = s;

  $(div).find("*").each(function () {
    $(this).height('100px');
  });

  $scope.trustedHtml = $sce.trustAsHtml(div.innerHTML);
}]);

Я хочу знать, есть ли какие-либо более эффективные методы для синтаксического анализа строки, представляющей html, а затем показывать этот html в представлении. Любая помощь приветствуется.

yuyokk 02 июль 2015, в 22:15

Источник

Теги:

javascript

html

angularjs

1 ответ

Ещё вопросы

Sean · Answer 1 · 2015-07-02T17-47-00.000Z

Вы можете сделать это в фильтр, например

app.filter('trusted', function($sce){
  return function(text) {
    return $sce.trustAsHtml(text);
  };
});

а затем в вашем html вы могли бы

<div ng-bind-html="text | trusted"></div>

спасибо за ответ Знаете ли вы, является ли это допустимым использованием $ sce.trustAsHtml (div.innerHTML) метода trustAsHtml?
Я не понимаю, почему этого не будет. Кто-то поправит меня, если я ошибаюсь.