如何通过延迟加载添加多个出口?

时间:2019-07-12 18:35:03

标签: angular typescript router-outlet

我正在做一个Angular 7应用程序并使用延迟加载,我想创建一个带有侧边栏的面板管理,并将所有管理模块加载到新的插座上。

如何将内容添加到新插座?这是我的代码,但是不起作用

延迟加载管理员路由代码

const routes: Routes = [
  {
    path:'', 
    component:AdminComponent,
    children:[
      {
        path: '',
        component:UserManagerComponent,
        outlet:"adminRouter"
      },
      {
        path: '',
        component:GraphicsComponent,
        outlet:"adminRouter"
      }
    ]
  }
];

懒惰的html管理模块

<p> Main </p>
<router-outlet name="adminRoute"></router-outlet>

应用路由模块

const routes: Routes = [
  { 
    path:'home', 
    loadChildren:'./public/home/home.module#HomeModule',
  },
  { 
    path:'login',
    loadChildren:'./public/login/login.module#LoginModule'
  },
  { 
    path:'admin',
    loadChildren:'./private/admin-dashboard/admin-dashboard.module#AdminDashboardModule',
    canActivate:[AuthGuard],
    canActivateChild:[AuthGuard],
    data: { expectedRole: ADMIN_ROLE }
  },
  {
    path:'register',
    loadChildren:'./public/register/register.module#RegisterModule'
  },
  { 
    path: '',
    pathMatch:'full',
    redirectTo:'home'
  }
];

0 个答案:

没有答案