Оказание наблюдения в динамическом шаблоне

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

Используя пример создания динамического шаблона, найденный здесь, как я могу сделать что-то асинхронное, как наблюдаемое излучение?

Я пробовал, например, this.addComponent("<div>{{ (thread | async)?.property }}</div>").

Я получаю сообщение об ошибке:

"The pipe 'async' could not be found ("<div>{{([ERROR ->]object | async)?.property}}</div>"):"

Здесь есть некоторые довольно очевидные контекстные проблемы. Мне просто трудно понять, что они собой представляют.

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

В дополнение к этому я пробовал:

this.addComponent(`<div>${this.myService.getObject()
        .map(object => {return object.property})}</div>`)

[object Object]. Предполагая, что здесь просто пустое место?

Обновление:

Итак, я добавил следующее к TemplateComponent, чтобы попытаться понять, что происходит здесь.

private object: Observable<any>
constructor(private router: Router, private myService: MyService) {
    this.myService.getObject()
    .subscribe(object => this.object = object)
}

this.addComponent('{{object?.property}}') затем отображает излучение, но он не отображает html в испускании, что наносит ущерб цели создания динамического шаблона в первую очередь для меня. Опять же, целью было создание привязок к html-рендерингу, и если мне нужно использовать [ innerHTML] для рендеринга html, я не могу этого сделать.

ОТВЕТЫ