Setting external html file to a TemplateRef in Angular2
<p>This is my code:</p>

<pre><code>@Component({
    selector: 'nav-menu',
    directives: [...ROUTER_DIRECTIVES, HighlightDirective, EditTmpl],
    template: '&lt;template [ngTemplateOutlet]="currentTplRef"&gt;&lt;/template&gt;'//require('./nav-menu.html')
})

export class NavMenu implements OnInit {
    @Input() templ: TemplateRef&lt;any&gt;;
    @ViewChild('displayTmpl') displayTmpl : TemplateRef&lt;any&gt;;
    @ViewChild('editTmpl') editTmpl: TemplateRef&lt;any&gt;;    
    childView: EmbeddedViewRef&lt;any&gt;;

    constructor(private authService: AuthService, private _viewContainer: ViewContainerRef) { }

    ngOnInit() {
        this.childView = this._viewContainer.createEmbeddedView(this.templ);
    }    
}
</code></pre>

<p>I have two external html files in the same folder as this ts file and the code inside looks like this (this html file is called displayTmpl):</p>

<pre><code>&lt;template #displayTmpl&gt;
    &lt;table&gt;...&lt;/table&gt;
&lt;/template&gt;
</code></pre>

<p>How can I load this html view dinamically? I want to set currentTplRef to one of my html files.</p>