无法从其他模块角度找到组件

Question

我宣布AppModule并导入我的HomeModule。

@NgModule({
  declarations: [
    AppComponent

  ],
  imports: [
    BrowserModule,
    HomeModule

  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

那是我的HomeModule

@NgModule({
  declarations: [
    HomeComponent,
    ContactComponent,
    Page404Component
  ],
  imports: [
    BrowserModule,
    HomeRoutingModule,
    MainModule,
    ReactiveFormsModule

  ],
  providers: []
})
export class HomeModule { 

}

接下来我尝试添加到app.component home.component，所以我做了这样的事情：

@Component({


     selector: 'em-home',
      templateUrl: './home.component.html',
      styleUrls: ['./home.component.scss']
   })
    export class HomeComponent {
}

到AppComponent.html：

<div>
<em-home></em-home>
</div>

然后我在浏览器中收到错误：

'em-home' is not a known element:
1. If 'em-home' is an Angular component, then verify that it is part of this module.
2. If 'em-home' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. ("<div>
[ERROR ->]<em-home></em-home>

有人能解释我的错误吗？

Answer 1

您忘记了主页模块组件中的exports。

你应该在这里添加：

@NgModule({
  declarations: [
    HomeComponent,
    ContactComponent,
    Page404Component
  ],
  imports: [
    BrowserModule,
    HomeRoutingModule,
    MainModule,
    ReactiveFormsModule

  ],
exports:[HomeComponent,
        ContactComponent,
        Page404Component], //<--here
providers: []
})
export class HomeModule { 

}

注意，您不需要出口提供商。