title: Angular5 Use Component from Module
body: <p>I am a noob with A5, doing my first 'component refactoring into modules.'  I'm trying to use a component that is defined in one module from another module.  I get the error, <code>ERROR in src/app/app-routing.module.ts(9,10): error TS2305: Module '"xxx/src/app/admin/admin.module"' has no exported member 'AdminHomeComponent'.</code></p>
  
  <p>I've looked at the other related questions, and I'm just plain missing something.  Hope you can help.</p>
  
  <p>app-routing.module.ts:</p>
  
  <pre><code>import { NgModule } from '@angular/core';
  import { RouterModule, Routes } from '@angular/router';
  import { CommonModule } from '@angular/common';
  import { HomeComponent } from './home/home.component';
  import { ArchitectureComponent } from './architecture/architecture.component';
  import { DesignComponent } from './design/design.component';
  import { HistoryComponent } from './history/history.component';
  import { AdminHomeComponent } from './admin/admin.module';
  
  const routes: Routes = [
    { path: '', redirectTo: '/home', pathMatch: 'full' },
    { path: 'home', component: HomeComponent },
    { path: 'architecture', component: ArchitectureComponent },
    { path: 'design', component: DesignComponent },
    { path: 'history', component: HistoryComponent }
  ];
  
  @NgModule({
    exports: [ RouterModule ],
    imports: [ RouterModule.forRoot(routes)]
  })
  
  export class AppRoutingModule { }
  </code></pre>
  
  <p>src/app/admin/admin.module:</p>
  
  <pre><code>import { NgModule } from '@angular/core';
  import { CommonModule } from '@angular/common';
  import { AdminHomeComponent } from './admin-home/admin-home.component';
  
  @NgModule({
    imports: [
      CommonModule
    ],
    exports: [
      AdminHomeComponent
    ],
    declarations: [
      AdminHomeComponent  // &lt;-- Tried adding this based on comments, no help
    ]
  })
  export class AdminModule { }
  </code></pre>
  
  <p>src/app/admin/admin-home/admin-home.component.ts</p>
  
  <pre><code>import { Component, OnInit } from '@angular/core';
  
  @Component({
    selector: 'app-admin-home',
    templateUrl: './admin-home.component.html',
    styleUrls: ['./admin-home.component.scss']
  })
  export class AdminHomeComponent implements OnInit {
  
    constructor() { }
  
    ngOnInit() {
    }
  
  }
  </code></pre>
  
  <p>And in case it helps,</p>
  
  <p>src/app/app.module.ts</p>
  
  <pre><code>import { BrowserModule } from '@angular/platform-browser';
  import { NgModule, NO_ERRORS_SCHEMA } from '@angular/core';
  import { MDBBootstrapModule } from 'angular-bootstrap-md';
  import { TreeModule } from 'angular-tree-component';
  
  import { AppComponent } from './app.component';
  ...
  import { HomeComponent } from './home/home.component';
  import { ComponentsModule } from './components/components.module';
  import { AdminModule } from './admin/admin.module';
  
  @NgModule({
    declarations: [
      AppComponent,
      ...
      HomeComponent,
      AdminModule   // &lt;-- Tried adding this based on comments, but no help
    ],
    imports: [
      BrowserModule,
      MDBBootstrapModule.forRoot(),
      TreeModule,
      AppRoutingModule,
      AdminModule,
      ComponentsModule
    ],
    schemas: [ NO_ERRORS_SCHEMA ],
    providers: [],
    bootstrap: [AppComponent]
  })
  export class AppModule { }
  </code></pre>
  
  <p>Maybe the answer is simple:  just import the component directly from the module?  </p>
  
  <p>But shouldn't I be able to use a component that is exported from a module, just by importing that component from the module?</p>
  
  <p>Thx for any advice!</p>