Angular 7+: Отрисовка директив в динамическом пользовательском контенте (HTML), полученном из REST API во время выполнения.

У меня есть приложение, которое извлекает пользовательский контент, такой как контент блога, который сохраняется как HTML на сервере.

Мне нужно отобразить его, и у него могут быть пользовательские директивы, такие как

REST API RESPONSE SAMPLE:
content: "<div>
<span class="impressive-css-class">This is rendered perfectly by passing HTML to sanitizer.bypassSecurityTrustHtml</span>
and 
<span spoiler>SpiderMan dies on Page 142: Rendered as HTML. Directive not processed (naturally)</span>
</div>"

Мне нужно отобразить директиву спойлера для этого динамически возвращаемого пользовательского контента.

Из SO и обширного поиска я узнал, что один из способов сделать это — включить JIT (без AOT) во время процесса сборки (buildOptimizer: false и импортировать «core-js/es7/reflect» в polyfills.ts, создать модуль/компонент, динамически использующий JIT) длинным сложным способом (который может сломаться при обновлении угловой версии)

Есть ли другой способ динамического отображения моего варианта использования, о котором я не знаю?


person Deepak Thomas    schedule 16.07.2019    source источник


Ответы (2)


Возможные пути реализации этого

  • Включение JIT-компилятора и создание динамических модулей
  • Угловые элементы
  • Изменение отображаемого HTML с использованием собственного JS или какой-либо другой библиотеки
person Deepak Thomas    schedule 18.07.2019

Вы можете использовать:

<div [innerHTML]="content"></div>

Что отобразит вашу переменную содержимого внутри этого элемента

Однако это не цель REST API.

person Robert garcia    schedule 16.07.2019
comment
Вопрос касается директив горячего рендеринга в динамически загружаемом HTML. - person Deepak Thomas; 16.07.2019