首页 文章

将Angular 2模块加载为子路径

提问于
浏览 次
2

我创建了一个ngModule（EducationModule），它加载一组导航项和子路由，这些路由加载到模块中定义的根组件（EducationComponent）中定义的路由器出口 . 除了我希望模块中定义的功能是另一个组件（AuthenticatedComponent）的子路由之外，一切都工作得很好 . 换句话说，我希望模块中定义的路由作为子路由附加到根级别定义的路由 . 这可能使用路由器3吗？

我希望在Educationized模块中定义的路由器插座中加载在EducationModule中定义的路由，但是它们将被加载到根AppComponent模板中的router-outlet中 . 请参阅下面的路线定义 .

app.routes.ts - 在AppModule中加载的主要路由

{
    path: '', component: AuthenticatedComponent, canActivate: [AuthGuard],
    children: [
      {
        path: 'profile/education',
        loadChildren: 'app/modules/education/education-module#EducationModule'
      },

education.routing.ts - EducationModule中的路线

const educationRoutes: Routes = [
  {
    path: 'profile/education',
    component: EducationComponent,
    children: [
      { path: '', component: WebinarsComponent },
      { path: 'webinars', component: WebinarsComponent },
      { path: 'programs', component: ProgramsComponent },
      {
        path: 'courses',
        component: CoursesComponent,
        resolve: {
          courses: CoursesResolve
        }
      }
    ]
  }
];

export const educationRouting: ModuleWithProviders = RouterModule.forChild(educationRoutes);
angular

1 回答

  • 2

    我认为 educationRoutes 中的第一条路线不应该有配置文件/教育前缀，因为它已经存在于其父节点（来自 AppModule 的路由） .

    我通常使用你描述的相同场景，它的工作原理 .

    试试这个：

    const educationRoutes: Routes = [{
    path: '' // prefix is already specified in AppModule,
    component: EducationComponent,
    children: [
      { path: '', component: WebinarsComponent },
      { path: 'webinars', component: WebinarsComponent },
      { path: 'programs', component: ProgramsComponent },
      {
        path: 'courses',
        component: CoursesComponent,
        resolve: {
          courses: CoursesResolve
        }
      }
    ]
  }
];

export const educationRouting: ModuleWithProviders = RouterModule.forChild(educationRoutes);
    回复于

相关问题