title: Angular 4 - How to load html files based on a condition in a component
body: <p>I wanna load a HTML file based on a condition. If my browser width less than 1000px I need to load a HTML, otherwise other HTML file.</p>
  
  <p>I tried with </p>
  
  <pre><code>import {
      Component,
      HostListener
  } from '@angular/core';
  
  @Component({
      selector: 'app-root',
      templateUrl: `{{tmplUrl}}`,
      styleUrls: ['./app.component.css']
  })
  export class AppComponent {
  
      tmplUrl: string = './app.component.html';
  
      @HostListener('window:resize', ['$event'])
      onResize(event) {
          if (event.target.innerWidth &lt;= 1000) {
              this.tmplUrl = "./app_mobile.component.html";
          } else {
              this.tmplUrl = "./app.component.html";
          }
      }
  }
  </code></pre>
  
  <p>Above code not working. How can I do this?</p>