Внедрение динамического HTML внутри компонентов из index.html в угловых 8 - PullRequest
0 голосов
/ 31 октября 2019

Я работаю над веб-приложением. у которого есть магнолия как CMS. Я все еще новичок здесь, но я объясню сценарий. Магнолия предоставляет index.html, который содержит ссылку на компоненты. Но для некоторых из этих компонентов он также предоставляет дополнительное HTML-содержимое. этот дополнительный контент должен отображаться внутри шаблона конкретного компонента. обратитесь к следующему для лучшего понимания. (помните, что это внутри index.html)

<my-component>
<div> this division has to be shown inside the my component template.</div>
</my-component>

Я пробовал следующие подходы до сих пор.

  1. пытается использовать - это, очевидно, неработать, как я недавно узнал, что angular не является мастером корневого шаблона (index.html). поэтому нг-контент никогда не работает. Поправьте меня, если я ошибаюсь.
  2. используя теневой взгляд. Я не эксперт в этом, но установка viewencapsulation = shadowdom и определение слота внутри шаблона компонента выполняет мою цель. Единственная проблема с этим подходом - область действия этого теневого элемента. он будет находиться внутри теневого корня, который имеет собственную область видимости, поэтому глобальные стили внутри него не применяются. Мне пришлось импортировать все глобальные CSS для каждого такого компонента, что приводит к сумасшедшему размеру файла main.js.

Может кто-нибудь предложить мне, если есть какое-либо лучшее или другое решение этой проблемы?

1 Ответ

0 голосов
/ 31 октября 2019

Вы пытались использовать значения Input () для этого компонента?

  1. index.html

<my-comp [myInputs]="'My Input HTML <b>Content</b>'">

Ваш принимающий компонент…
<div [innerHTML]="myInputs"></div>
...