I have 3 modules: App, Shared, Core and Admin This is the root object:
export const routes: Routes = [
{path:'home', component:HomeComponent, canActivate:[AuthGuardService]},
{path:'detail/:id', component:DetailComponent},
{path: 'register', component: RegisterComponent},
{path:'login', component: LoginComponent},
{path:'', redirectTo:'login', pathMatch: 'full'},
{path:'**', pathMatch: 'full' ,redirectTo:'login'}
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule { }
Core Module, where are all the main components declared, so this is like my main module and im importing the appRoutingModule here:
@NgModule({
declarations: [
HomeComponent,
DetailComponent,
RegisterComponent,
LoginComponent,
NavbarComponent
],
imports: [
SharedModule,
AppRoutingModule,
AdminModule
],
exports:[AppRoutingModule, NavbarComponent]
})
export class CoreModule {
//para evitar que este modulo seja importado mais que uma vez
constructor( @Optional() @SkipSelf() parentModule: CoreModule) {
if (parentModule) {
throw new Error('CoreModule has already been loaded. You should only import Core modules in the AppModule only.');
}
}
}
The app.Module
@NgModule({
declarations: [
AppComponent,
],
imports: [
BrowserModule,
SharedModule,
CoreModule,
AdminModule
],
providers: [
DataService,
fakeBackendProvider,
AuthService,
AuthGuardService,
ShoppingCartService
],
bootstrap: [AppComponent]
})
export class AppModule { }
And finally, the admin module and it's routing file
@NgModule({
imports: [
SharedModule,
AdminRoutingModule
RouterModule.forChild([])
],
declarations: [AdminComponent],
exports:[AdminComponent],
providers:[AuthGuardService]
})
export class AdminModule { }
This is the configuration file of the admin routes:
export const adminRoutes: Routes = [
{path:'admin', component:AdminComponent , canActivate:[AuthGuardService] },
];
@NgModule({
imports: [RouterModule.forChild(adminRoutes)],
exports: [RouterModule]
})
export class AdminRoutingModule { }
I've tried everything I could imagine, importing, exporting, declaring...nothing works. When I click in the Admin link (when logged in), the system doesn't recognize the routes, so it gives me the login because thats the so called wild card...
He had some modules in shared module which were causing duplicate imports,
Like HttpClientModule, AdminModule, etc.
Imports were messed up. Once imports were in right place. It was cool and moved Admin module as a lazy loaded module.
And i implemented the same explained by Gérôme Grignon on his project. And it worked fine.