Вставка HTML (с угловыми 2 директивами) с сервера в DOM

Question

У меня есть ~ 2000 строк HTML-кода, которые я могу получить с моего Java-сервера. Этот HTML-код также содержит угловые директивы, такие как ngIf* и (click) и [ngClass]. Когда я пытаюсь отобразить этот HTML в моем клиенте с помощью следующих методов:

<div [innerHTML]="htmlData"></div>
<div innerHTML="{{ htmlData }}"></div>

Я вижу, что все элементы HTML отображаются правильно, но ни одна из угловых директив не работает (например, некоторые элементы HTML должны быть скрыты с помощью *ngIf, но они не ... и ни один из (click) события работают. Что я могу сделать, чтобы это исправить?

Мне нужна эта функциональность, потому что я доставляю свой код в виде JAR-файла различным пользователям для запуска на их локальных компьютерах, и я хочу передать HTML-код с некоторых Amazon S3, чтобы я мог обновлять его всякий раз, когда я хочу дать их на сайте обновление.

И я попытался посмотреть на приведенные ниже ответы, но они имели дело с чистым HTML с сервера и не имели никаких угловых директив.

Вставка HTML с сервера в DOM с помощью angular2 (общие манипуляции с DOM в Angular2)

Угловая привязка HTML

Answer 1

К сожалению, это невозможно. InnterHTML поместит туда HTML-код - не угловой. Угловой код должен быть скомпилирован заранее - процесс, в котором все директивы и html magic заменены простыми JS.

Вы можете преобразовать свой угловой код в обычный html путем рендеринга на стороне сервера с помощью узла js.

Подробнее о рендеринге на стороне сервера можно прочитать здесь: https://angular.io/guide/universal

Но вы также можете использовать JAVA и любой популярный шаблонизатор для JAVA-серверов, если вы отправите свои параметры в запросе http.