Angular 7 - innerHTML - рендеринг HTML-тегов из БД - PullRequest
1 голос
/ 08 марта 2019

Я создаю инструмент документирования, в котором у вас есть возможность написать документ (в contenteditable элементах), в который вы можете вставлять различные типы блоков и т. Д. С форматированным стилем (имена классов).

Он сохраняется в mongoDB при загрузке, но когда я отрисовываю документы из БД с помощью innerHTML, стили отображаются только для элементов, если у меня есть определение css в TAG, а не в CLASS.

Например Работы:

code {
 color: red;
}

Не работает:

.jcl-code {
 color: red;
}

У меня есть viewEncapsulation.None, и я также создал трубу safeHtml, чтобы пропустить санитарную обработку.

<p class="card-body" innerHTML="doc[currentId].body | safeHtml">

Не могли бы вы дать мне несколько советов, почему это не работает с классами?

Большое спасибо!

1 Ответ

0 голосов
/ 08 марта 2019

вам нужно добавить :host ::ng-deep в ваш класс, чтобы :host ::ng-deep .jcl-code {...}, поскольку необходимые классы не добавляются автоматически в HTML, добавленный через [innerHTML].

, для получения более подробной информации и информации о ::ng-deep, и этопроверка использования https://stackoverflow.com/a/36265072/606104

...