子路在功能模块中无法使用

Question

我有一个大的应用程序，我不想把所有的东西都放在app-routing.module和app.module.ts文件里（例如路由路径），我想把我的模块组织成特色模块（目前我没有使用lazy loading）。

我的问题是，当我在app.module.ts中的imports数组中只包含正常的路由路径而不包含子路由时，功能模块就可以工作，但当我在一些功能模块中包含子路由时，它就不能工作了。

//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. 你有一个 <router-outlet></router-outlet> 在您的 LayoutComponent 中？
2. 您希望指向 CablecoRoutingModule -> DashboardComponent 的路由是什么？