Создание элементов в Aurelia

Question

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

Например: У меня есть очень простой компонент протоколирования:

Logging.html

<template> 
    <h1>Logging....</h1> 
</template> 

Logging.ts:

export class Logging { 
    constructor() { 
     console.log('Logging constructor') 
    } 
} 

компонент работает, как ожидалось, когда я «просто поставить это на странице ".

Теперь внутри какой-то метод, который создает люминофора виджет у меня есть что-то вроде этого:

var widget = new Widget(); 
widget.title = "Got Logs?"; 
var contentElement = document.createElement('logging'); 
widget.node.appendChild(contentElement); 
panel.insertBottom(widget); 

Этот код, получающий люминофора панели, создает виджет, создает элемент, который выглядит как: <logging></logging> и присоединяет его к внутреннему узлу виджета. Получаемый «DOM» правильный, но aurelia не отображает элемент.

Я также попытался с помощью TemplatingEngine так:

import { inject, TemplatingEngine } from 'aurelia-framework'; 

@inject(TemplatingEngine) 
export class AureliaRoot { 
    constructor(templatingEngine) { } 

    attached() { 
     var contentElement = document.createElement("logging"), 
      el = document.getElementById("my-element"); 
     el.appendChild(contentElement); 
     templatingEngine.enhance({element: el, bindingContext: {}}); 
    } 
} 

Но это не похоже на работу, хотя я сомневаюсь, что я использую это правильно, и я думаю, что, возможно, придется использовать compile, на самом деле не уверен там.

Любые идеи были бы оценены.

Answer 1

Извините, что я не смогу полностью ответить, но я считаю, что вам нужно будет использовать Aurelia ViewCompiler для компиляции фрагментов HTML, сгенерированных таким образом, чтобы они анализировались Aurelia.

Попробуйте посмотреть по следующей ссылке для получения дополнительной информации: How do you use ViewCompiler to manually compile part of the DOM?