Question

早上好，我将尝试解释我的问题。

我有一个Angular SPA，在这个SPA中，我实现了延迟加载，并且在其中一个模块中，我想创建subModules。

我的意思是，此SPA中有很多页面，并且在其中一个页面中有一个组件（UserComponent），该组件在几个页面中共享，而不是在所有页面中共享。

所以我创建了一个模块。我可以获取模块，但不能获取子模块。

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { UserComponent } from './user/user.component';

export const routes: Routes = [
  // {
  //   path: '',
  //   component: UserComponent,
  //   children: [
  //     { path: '', component: AccountsMenuComponent },
  //   ]
  // },
  {
    path: '',
    component: UserComponent,
    children: [
      { path: 'accounts-menu', loadChildren: './accounts-menu/accounts-menu.module#AccountsMenuModule' }
    ]
  },
];

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

export class UserRoutingModule {}

我知道我可以像在注释行中看到的那样加载组件，但是如果这样做，我每次都在加载UserComponent时，我就不要了。

我想在加载其子模块之后加载一次。

在mainModule中，我有这个html代码。（user.component.html）

<div class="section-content ">
    <ng-container zoomHeader>
        <div>
            <app-user-information-header #userSettingsHeader>
            </app-user-information-header>
        </div>
    </ng-container>


    <ng-container zoomMain>
        <div>
            <router-outlet></router-outlet>
        </div>
    </ng-container>


</div>

我与您分享account-menu-routing.module.ts的代码

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { AccountsMenuComponent } from './accounts-menu.component';

const routes: Routes = [
  {
     path: '', 
     component: AccountsMenuComponent 
    }
  ];

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

还有account-menu.module.ts

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';

import { AccountsMenuRoutingModule } from './accounts-menu-routing.module';

@NgModule({
  declarations: [],
  imports: [
    CommonModule,
    AccountsMenuRoutingModule
  ]
})
export class AccountsMenuModule { }

有什么建议吗？

如何在延迟负载下使用路由器插座

0 个答案: