Angular2 - Add div to DOM
<p>I am trying to add some child elements to a div using Angular2. I know I can get the element using @ViewChild but how can I actually append some html code into the DOM?</p>

<p>What I'm trying to do is "mimic" the JQuery append function. Is there any way to do that in Angular2 ?</p>

<p>Thanks very much for the help!</p>

<p>Here is my component:</p>

<pre><code>import { Component, ViewChild, ElementRef } from '@angular/core';

@Component({

  moduleId: module.id,

  selector: 'my-selector',

  template: `&lt;div #builder class="row"&gt;
  &lt;div class="s12 teal lighten-2"&gt;
    &lt;p class="flow-text"&gt;teste do html builder&lt;/p&gt;
  &lt;/div&gt;
&lt;/div&gt;
&lt;a class="btn-floating btn-large waves-effect waves-light red"    (click)="addRow()"&gt;&lt;i class="material-icons"&gt;add&lt;/i&gt;&lt;/a&gt;`,

})

export class BuilderComponent {

@ViewChild('builder') builder:ElementRef;

  ngAfterViewInit() {
    console.log(this.builder.nativeElement.innerHTML);
  }

  addRow() {

     let htmlText = `&lt;div #row class="row"&gt;
       &lt;div class="s12 teal lighten-2"&gt;
        &lt;p class="flow-text"&gt;div inside parent - html builder&lt;/p&gt;
      &lt;/div&gt;
    &lt;/div&gt;`;

     this.builder.nativeElement.append(htmlText); (???)
  }
 }
</code></pre>