I'm relatively new to using Angular and I'm struggling to determine the correct placement for my AlertService and module imports. Currently, I have it imported in my core module, which is then imported in my app module. The AlertService functions properly in my app.component.html, but I'm encountering difficulties in getting it to work in my HomeModule, which is also imported in the appModule.
Below is the definition for my AlertModule:
@NgModule({
imports: [CommonModule],
declarations: [AlertComponent],
exports: [AlertComponent]
})
export class AlertModule { }
Next, here is my core module definition:
@NgModule({
declarations: [
FooterComponent,
HeaderComponent
],
imports: [
BrowserModule,
BrowserAnimationsModule,
AlertModule
],
providers: [
NavbarService
],
bootstrap: [],
exports: [
FooterComponent,
HeaderComponent,
AlertComponent
]
})
export class CoreModule extends EnsureImportedOnceModule {
public constructor(@SkipSelf() @Optional() parent: CoreModule){
super(parent);
}
}
And here is my app module definition:
@NgModule({
imports: [
CoreModule,
SharedModule,
AppRoutingModule,
HomeModule
],
declarations: [
AppComponent
],
providers: [],
bootstrap: [AppComponent],
exports: [
]
})
export class AppModule { }
Unfortunately, I'm encountering the following error in app/modules/home/home.component.html:2:1 - error NG8001: 'alert' is not a known element.
Can anyone provide guidance on how to properly utilize the AlertModule within my project structure?