My AppModule is ready and I have imported my HomeModule to it.
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
HomeModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
This is how my HomeModule looks like:
@NgModule({
declarations: [
HomeComponent,
ContactComponent,
Page404Component
],
imports: [
BrowserModule,
HomeRoutingModule,
MainModule,
ReactiveFormsModule
],
providers: []
})
export class HomeModule {
}
After that, I decided to add the home.component
into the app.component
, here is what I did:
@Component({
selector: 'em-home',
templateUrl: './home.component.html',
styleUrls: ['./home.component.scss']
})
export class HomeComponent {
}
I added this code snippet to AppComponent.html :
<div>
<em-home></em-home>
</div>
However, upon checking my browser, I encountered some errors:
'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>
I need help in understanding what went wrong with my implementation. Can anyone provide guidance on this issue?