title: Dynamically add custom component to loaded DOM (aurelia.js)
body: <p>Is it possible to add a custom component to the DOM once it has already been loaded?</p>
  
  <p>E.g. When clicking a button</p>
  
  <p>Template</p>
  
  <pre><code>&lt;template&gt;
      &lt;button click.delegate="add_component()"&gt; Press me &lt;/button&gt;
  &lt;/template&gt;
  </code></pre>
  
  <p>Viewmodel</p>
  
  <pre><code>@inject(Element)
  
  export class App {
  
    constructor(element) {
        this.element = element;
    }
  
    function add_component() {
       var component = document.createElement('&lt;customElement&gt;&lt;/customElement&gt;');
       this.element.appendChild(component);
    }
  }
  </code></pre>