При создании пользовательского элемента в DOM и добавлении соответствующей модели представления, которая реализует привязку из aurelia-framework, мое представление прекрасно отрисовывается.

Пользовательский элемент в DOM как так:

<!-- chatbox.html -->
<template>
...    
    <ul class="chat">
        <answer name="Reah Miyara" nickname="RM" text="Hello World"></answer>
    </ul>
...
    <button class="btn" click.trigger="addCustomElement()">Add</button>
...
</template>

Волшебное рендеринг Aurelia приводит к появлению различных дочерних элементов, связанных с пользовательским элементом в DOM, при проверке из браузера.

Проблема возникает, когда я пытаюсь динамически добавить дополнительные пользовательские элементы в DOM, используя jQuery, вот так ...

// chatbox.js
addCustomElement() { 
    $('.chat').append('<answer name="Joe Smith" nickname="JS"></answer>');
}

Вызов этого метода с помощью кнопки(Click.trigger Аурелии) действительно добавляет пользовательский элемент в DOM, нобез различные дочерние элементы, которые позволяют правильно отображать пользовательский элемент в представлении ...

Как правильно динамически добавить пользовательские элементы в DOM или сказать Aurelia обработать пользовательский элемент, который я добавил, чтобы он отображался в моем представлении?

Заранее спасибо!