延迟加载 Children 未加载

Question

我有一个关于惰性模块的问题。除了最后一个，我现在有多个惰性模块在工作。我用两个 children 创建了一个惰性模块，但由于某种原因页面没有加载。

我已经尝试了很多东西。添加了路径名，添加了路径匹配：'full' 但似乎没有任何效果。

AppRoutingModule:

const routes: Routes = [
  { path: '', component: HomeComponent, pathMatch: 'full' },
  //{ path: 'lottery-games', component: LotteryGamesComponent },
  //{ path: 'lottery-games/detail', component: LotteryGamesDetailComponent },
  {
    path: 'lottery-games',
    loadChildren: () =>
      import('./components/lottery-games/lottery-games.module').then((m) => m.LotteryGamesModule),
  },

第二个路由模块

const routes: Routes = [
  { path: '', component: LotteryGamesComponent },
  { path: 'detail', component: LotteryGamesDetailComponent },
];

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

第二个模块：

@NgModule({
  declarations: [LotteryGamesComponent, LotteryGamesDetailComponent, LotteryGamesListComponent],
  imports: [
    CommonModule,
    LotteryGamesRoutingModule,
    MatCardModule,
    MatFormFieldModule,
    FormsModule,
    MatTableModule,
    ReactiveFormsModule,
    MatInputModule,
    MatButtonModule,
    MatIconModule,
    MatCheckboxModule,
    MatAutocompleteModule,
    MatSelectModule,
    MatDialogModule,
  ],
})
export class LotteryGamesModule {}

文件夹结构：

lottery-games
- lottery-games-详情
  - lottery-games-detail.component.ts
- lottery-games-列表
  - lottery-games-list.component.ts
lottery-games.module.ts
lottery-games-路由.module.ts
lottery-games.component.ts

Lottery-games.组件

<mat-card>
  <h2 class="title">Overzicht</h2>
  <hr />

  <mat-card-content>
    <ng-container *ngIf="lotteryGames$ | async as lotteryGamesList">
      <ng-container *ngIf="lotteryGamesList.length > 0">
        <app-lottery-games-list [LotteryGamesList]="lotteryGamesList"></app-lottery-games-list>
      </ng-container>

      <ng-container *ngIf="lotteryGamesList.length === 0 || lotteryGamesList === null">
        <div class="no-results">
          <p class="no-result-p">Geen resultaten gevonden</p>
        </div>
      </ng-container>
    </ng-container>
  </mat-card-content>
</mat-card>

我需要多一双眼睛。我好像找不到

我没有任何错误，所以看起来它找不到我的路线。但是当我直接在地址栏中转到详细信息页面时，它起作用了。只有 parent 组件不工作

Answer 1

我发现了问题。在我的模块中，我为我的组件做了导入，但是路径是“..”，它不起作用，我花了很长时间才找到它。

延迟加载 Children 未加载

Lazy loading Children not loading

routes

lazy-loading

typescript

angular