Looking for help with organizing modules in a large app without cluttering the app-routing.module and app.module.ts files. Specifically focusing on managing route paths through featured modules (not using lazy loading at the moment).
Encountering issues when including children routes in certain feature modules, like CablecoModule, while normal route paths work fine. Can anyone provide assistance?
//app.module.ts
@NgModule({
declarations: [
AppComponent,
PagenotfoundComponent,
LoginComponent,
HomeComponent,
ContactUsComponent,
ForgotPasswordComponent,
CoffeeComponent
],
imports: [
BrowserModule,
BrowserAnimationsModule,
ToastrModule.forRoot(),
Ng4LoadingSpinnerModule.forRoot(),
ReactiveFormsModule,
FormsModule,
HttpClientModule,
MatDatepickerModule,
MatFormFieldModule,
MatNativeDateModule,
MatInputModule,
NgbModule.forRoot(),
UsersModule,
CablecoModule,
UiModule,
AppRoutingModule,
],
providers: [
{provide: HTTP_INTERCEPTORS, useClass: Interceptor, multi: true},
MatDatepickerModule
],
bootstrap: [AppComponent],
exports: []
})
export class AppModule { }
//app routing
const appRoutes: Routes = [
{ path: '', component: HomeComponent , canActivate: [AnonymousGuard]},
{ path: 'coffee', component: CoffeeComponent },
{ path: 'contact-us', component: ContactUsComponent },
{ path: 'login', component: LoginComponent},
{ path: 'forgot-password', component: ForgotPasswordComponent },
{ path: 'cpe20', component: Cpe20Component },
{path:"**" , component:PagenotfoundComponent}
];
@NgModule({
imports: [
RouterModule.forRoot(appRoutes)
],
exports: [
RouterModule
]
})
export class AppRoutingModule {
}
//cablecomodule
@NgModule({
imports: [
CommonModule,
FormsModule,
ReactiveFormsModule,
AppRoutingModule,
Ng2SmartTableModule,
NgbModule,
MatDatepickerModule,
MatFormFieldModule,
MatNativeDateModule,
MatInputModule,
MatSidenavModule,
BrowserAnimationsModule,
MatTooltipModule,
CountUpModule,
NgxDaterangepickerMd.forRoot(),
CablecoRoutingModule
],
declarations: [DashboardComponent, SurveyComponent, GoogleAutocompleteDirective, ..., SignupComponent],
providers:[DataService, ... , SignupComponent],
})
export class CablecoModule { }
//cableco-routing
const routess: Routes = [
{
path: 'ibs', component: LayoutComponent, children: [
{
path: '',
redirectTo: 'dashboard',
pathMatch: 'full'
},
{
path: 'dashboard',
component: DashboardComponent
},
{
path:"signup",
component:SignupComponent
}
]
}
]
@NgModule({
imports: [RouterModule.forChild(routess)],
exports: [RouterModule]
})
export class CablecoRoutingModule { }