Question

再次从延迟加载模块调用时，链接连接不可用。

1.app-routing.module.ts

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

const WEB_PATH = 'app/web';
const routes: Routes =  [
  {path: '', redirectTo: 'main', pathMatch: 'full'},
  {path: 'main', loadChildren: `${WEB_PATH}/main/main.module#MainModule`},
  {path: 'flight/list', loadChildren: `${WEB_PATH}/flight/booking-list/flight-list.module#FlightListModule`},
  {path: 'system', loadChildren: `${WEB_PATH}/system-management/system-management.module#SystemManagementModule`},
];

@NgModule({
  imports: [RouterModule.forRoot(routes, { enableTracing: true })],
  exports: [RouterModule]
})
export class AppRoutingModule { }

system-management-routing.module.ts

const routes: Routes = [
  {
    path: '', component: SystemManagementComponent,
    children: [
      {
        path: 'detailCode', 
        children: [
          {
            path: '', 
            loadChildren: `${WEB_PATH}/detail-code/detail-code.module#DetailCodeModule`, 
            outlet: 'systemManagementContent',
          }
        ]
      }
    ]
  }
]
@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class SystemManagementRoutingModule { }

3.system-management.component.html

<div class="system-management">
  <aside class="sidebar">
    <h2>기초코드</h2>
    <ul>
      <li [routerLink]="[{outlets: {systemManagementContent: ['detailCode/holiday']}}]">공휴일</li>
      <li></li>
      <li></li>
    </ul>
  </aside>
  <div class="dfdsf">
      <router-outlet name="systemManagementContent"></router-outlet>
  </div>

</div>

4.detail-code-routing.module.ts

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { DetailCodeHolidayComponent } from './holiday/detail-code-holiday.component';
import { DetailCodeComponent } from './detail-code.component';

const routes: Routes = [
  {
    path: '', component: DetailCodeComponent,
    children: [
      {path: 'holiday', component: DetailCodeHolidayComponent}
    ],
  },
  {path: 'holiday', component: DetailCodeHolidayComponent}
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class DetailCodeRoutingModue { }

错误：无法匹配任何路由。网址段：“系统” enter image description here

我正在寻找解决方案。

延迟加载不会将出口应用于子路由器

0 个答案: