title: Angular 6.0.3 HTML Component selector not working
body: <p>Html selector of angular component is not rendering. <br>Here is the module route file.</p>
  
  <pre><code>const routes: Routes = [
       {
            path: 'lms',
            canActivate: [AuthGuard],     
            component: LibraryHomeComponent,
            children: [
                 { path: 'book/list', component: BookListComponent }
            ]
       }
  ];
  
  @NgModule({
       imports : [          
            RouterModule.forChild(routes)
       ],
       providers: [
            AuthGuard
       ],
       exports: [ RouterModule ]
  })
  export class BookRouteModule {}
  </code></pre>
  
  <p>After that, I defined the module. This module is a <strong>sub-module</strong> of the system.<br></p>
  
  <pre><code>@NgModule({
       imports: [
            BookRouteModule,
            MatImportModule
       ],
       declarations: [
            BookListComponent,
            LibraryNavbarComponent, /* &lt;== declared here */
            LibraryHomeComponent          
       ]
  })
  export class BookModule {}
  </code></pre>
  
  <p>In the Library Home Component template file, the navbar component is initialized using html tag.</p>
  
  <pre><code>&lt;mat-sidenav-container class="all-content"&gt;
    &lt;app-library-navbar&gt;&lt;/app-library-navbar&gt;
    &lt;mat-sidenav-content&gt;
      &lt;router-outlet&gt;&lt;/router-outlet&gt;
    &lt;/mat-sidenav-content&gt;
  &lt;/mat-sidenav-container&gt;
  </code></pre>
  
  <p>Below is the Library Navbar Component.</p>
  
  <pre><code>@Component({
    selector: 'app-library-navbar',
    templateUrl: './library-navbar.component.html',
    styleUrls: ['./library-navbar.component.css']
  })
  export class LibraryNavbarComponent implements OnInit {}
  </code></pre>