兒童路線在功能模塊中不起作用

Question

我有一個大應用程序，我不想在 app-routing.module 和 app.module.ts 文件中包含所有內容。 （例如路線路徑）我想將我的模塊組織成特色模塊（現在我不使用延遲加載）。

我的問題是，當我只包含沒有子路由的正常路由路徑時，app.module.ts 中的導入數組中的功能模塊正在工作。但是當我在某些功能模塊中包含子路由時，它就無法正常工作。CablecoModule 在這個案例請幫幫我

//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: [
    // AppRoutingModule,
    // MatDatepickerModule,
    // MatFormFieldModule,
    // MatNativeDateModule,
    // MatInputModule,
    // BrowserAnimationsModule
  ]
})
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),
        // NgDatepickerModule
    ],
    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
    //NgxPaginationModule
  ],

  declarations: [DashboardComponent, SurveyComponent, GoogleAutocompleteDirective, GoogleMapComponent, LitBuildingsListComponent, SearchResultsComponent, ListOfUsersComponent, ListOfOrganizationsComponent, ConfigurationComponent, OtherResultsComponent, OrganizationTypeComponent, MultiSiteSearchComponent, RequestServiceabilityComponent, SearchPreviewComponent, PricingComponent, TvCardComponent, UserProfileComponent, ChangePaswComponent, AllMultiSiteSearchesComponent, PromotionsComponent, ComcastContractComponent, ImportServicesComponent, ProvidersComponent, QuotesDashboardComponent, QuotesAdminDashboardComponent, SpectrumContractComponent, SearchHistoryComponent, PackagesComponent, ComcastPackagesComponent, RegularPricingComponent, PackagePricingComponent, FiberPricingComponent, FiberAndVoicePricingComponent, Cpe20Component, CoxContractComponent, ExportComponent, StatisticsComponent, ImportStatusesComponent , SignupComponent],
  providers:[DataService, MatDatepickerModule,DashboardComponent, SurveyComponent, GoogleAutocompleteDirective, GoogleMapComponent, LitBuildingsListComponent, SearchResultsComponent, ListOfUsersComponent, ListOfOrganizationsComponent, ConfigurationComponent, OtherResultsComponent, OrganizationTypeComponent, MultiSiteSearchComponent, RequestServiceabilityComponent, SearchPreviewComponent, PricingComponent, TvCardComponent, UserProfileComponent, ChangePaswComponent, AllMultiSiteSearchesComponent, PromotionsComponent, ComcastContractComponent, ImportServicesComponent, ProvidersComponent, QuotesDashboardComponent, QuotesAdminDashboardComponent, SpectrumContractComponent, SearchHistoryComponent, PackagesComponent, ComcastPackagesComponent, RegularPricingComponent, PackagePricingComponent, FiberPricingComponent, FiberAndVoicePricingComponent, Cpe20Component, CoxContractComponent, ExportComponent, StatisticsComponent, ImportStatusesComponent , 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 { }

Answer 1

1. 你的 LayoutComponent 中有<router-outlet></router-outlet>嗎？
2. 您期望通往 CablecoRoutingModule -> DashboardComponent 的路線是什么？