Component is part of the declaration of 2 modules
Remove the declaration from AppModule
, but update the AppModule
configuration to import your AddEventModule
.
.....
import { AddEventModule } from './add-event.module'; // <-- don't forget to import the AddEventModule class
@NgModule({
declarations: [
MyApp,
HomePage,
Login,
Register,
//AddEvent, <--- remove this
EventDetails
],
imports: [
BrowserModule,
IonicModule.forRoot(MyApp),
HttpModule,
AngularFireModule.initializeApp(config),
AddEventModule, // <--- add this import here
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
HomePage,
Login,
Register,
AddEvent,
EventDetails
],
providers: [
StatusBar,
SplashScreen,
{provide: ErrorHandler, useClass: IonicErrorHandler}, Eventdata, AuthProvider
]
})
export class AppModule {}
Also,
Note that it's important that your AddEventModule
exports the AddEvent
component if you want to use it outside that module. Luckily, you already have that configured, but if it was omitted, you would've gotten an error if you tried to use the AddEvent
component in another component of your AppModule
Some people using Lazy loading
are going to stumble across this page.
Here is what I did to fix sharing a directive.
- create a new shared module
shared.module.ts
import { NgModule, Directive,OnInit, EventEmitter, Output, OnDestroy, Input,ElementRef,Renderer } from '@angular/core';
import { CommonModule } from '@angular/common';
import { SortDirective } from './sort-directive';
@NgModule({
imports: [
],
declarations: [
SortDirective
],
exports: [
SortDirective
]
})
export class SharedModule { }
Then in app.module and your other module(s)
import {SharedModule} from '../directives/shared.module'
...
@NgModule({
imports: [
SharedModule
....
....
]
})
export class WhateverModule { }