Question

我的应用程序的结构是：

src
仪表板（主要组件）
部门（子部门）

添加（子子组件）

const r: Routes = [
  { path: "", redirectTo:'/dashboard' ,pathMatch: 'full'},
  { path: "dashboard", component: DashboardComponent, loadChildren:'./dashboard/dashboard.module#DashboardModule' },
  { path: "Top-nav", component: TopNavComponent },
  { path: "boxed", component: BoxedComponent },
  { path: "fixed", component: FixedComponent },
  { path: "collapse", component: CollapsedSidebarComponent },
   ];

在app.module.ts中，我添加了RouterModule.forRoot（r），这是dashboard.routing.module的代码：

const routes: Routes = [
    { path: 'dashboard', component: DashboardComponent, children: [
            { path: "", component: LoginComponent },
            { path: "Calender", component: CalenderComponent },
            { path: "MailBox", component: MailBoxComponent },
            { path: "compose", component: ComposeComponent },
            { path: "Read", component: ReadMailComponent },
            { path: "tables", component: TablesComponent },
            { path: "simpleTables", component: SimpleTablesComponent },
            { path: "dataTables", component: DataTablesComponent },
            { path: "register", component: RegisterComponent },
            { path: "dash-panel", component: DashboardPanelComponent },
            {path : 'department', component: DepartmentComponent}
          ]
}
];

@NgModule({
  imports: [
    RouterModule.forChild(routes),
    FormsModule,
    ReactiveFormsModule,
  ],

这里是Department.routing.module的

const routes: Routes = [
  { path: "", redirectTo: "department", pathMatch: 'full' },
  {
    path: "department", component: DepartmentComponent, 
    children: [
      { path: 'add', component: AddComponent },
      { path: 'edit/:id', component: AddComponent },
      { path: 'view/:id', component: ViewComponent },
    ]
  }
];
@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})

如果我渲染htttp：localhost：4200 / dashboard / department，效果很好，但是如果我渲染htttp：localhost：4200 / dashboard / department / add，我得到的错误是：

core.js:1673 ERROR Error: Uncaught (in promise): Error: Component DashboardComponent is not part of any NgModule or the module has not been imported into your module.
Error: Component DashboardComponent is not part of any NgModule or the module has not been imported into your module.
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._createCompiledHostTemplate (compiler.js:23968)
    at compiler.js:23944
    at Array.forEach (<anonymous>)
    at compiler.js:23941
    at Array.forEach (<anonymous>)
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileComponents (compiler.js:23930)
    at compiler.js:23858
    at Object.then (compiler.js:1012)
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileModuleAndComponents (compiler.js:23857)
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler.compileModuleAsync (compiler.js:23817)
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._createCompiledHostTemplate (compiler.js:23968)
    at compiler.js:23944
    at Array.forEach (<anonymous>)
    at compiler.js:23941
    at Array.forEach (<anonymous>)
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileComponents (compiler.js:23930)
    at compiler.js:23858
    at Object.then (compiler.js:1012)
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileModuleAndComponents (compiler.js:23857)
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler.compileModuleAsync (compiler.js:23817)
    at resolvePromise (zone.js:814)
    at resolvePromise (zone.js:771)
    at zone.js:873
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:3811)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:188)
    at drainMicroTaskQueue (zone.js:595)

子子路径在角度6中不起作用

0 个答案: