Angular 2架构：ngModules＆路由器

我打算建立一个网站，但在架构上存在一些混淆。通常，网站有一个“家庭”应用程序。具体而言，这是您推销主要应用程序的地方，可以提供Q & A，博客，联系我们，定价等等，这些可能非常大。一旦用户登录系统，然后他们进入“主”应用程序。Angular 2架构：ngModules＆路由器

问题是，只有一个路由器插座，两个应用程序都有完全不同的导航菜单，可用于每条路线。如果我在AppModule下有HomeModule和MainModule，我应该在AppComponent的模板中使用* ngIf作为我的nav/menues组件用于每个相应的应用程序和一个路由器插座？我真的不清楚你如何在两个完全不同的应用程序之间进行导航，这些应用程序有自己的菜单和只有一个路由器插座。另一种选择是在每个模板上为HomeModule和MainModule包含导航/菜单/页脚，而在AppComponent的模板中基本上只有一个路由器插件，这不是一个可伸缩的解决方案。

任何帮助将不胜感激。

来源

2017-08-30 tommyc38

你可以有嵌套路由器网点的一百万，如果你想。 Angular路由器功能非常强大，你应该检查它的文档和最佳实践 – smnbbrv

@smnbbrv你是说那么AppModule（AppComponent的模板）只不过是一个路由器插座，然后HomeModule和MainModule都会有他们的nav/menues路由器插座的顶层组件？请参阅https://angular.io/guide/router#child-routing-component – tommyc38

这正是我的意思 – smnbbrv

下面是一个例子：

app.component.html

<router-outlet></router-outlet>

查看 “无壳”，如登录这里路由。正如“壳”组件一样。

shell.component.html

<pm-menu></pm-menu> 

<div class='container'> 
    <router-outlet></router-outlet> 
</div>

所有其他网页被路由到这个孩子路由器的出口。

我只有一个“外壳”，但您可以轻松拥有“主外壳”和“主外壳”两者都将路由到主应用程序组件的路由器插座。然后

的路线将是这个样子：

RouterModule.forRoot([ 
    { 
     path: 'app', 
     component: MainShellComponent, 
     children: [ 
      { path: 'page1', component: Page1Component }, 
      { path: 'page2', component: Page2Component }, 
     ] 
    }, 
    { 
     path: '', 
     component: HomeShellComponent, 
     children: [ 
      { path: 'welcome', component: WelcomeComponent }, 
      { path: '', redirectTo: 'welcome', pathMatch: 'full' }, 
     ] 
    }, 
    { path: '**', component: PageNotFoundComponent } 
])

来源

2017-08-30 18:27:02 DeborahK

Angular 2架构：ngModules＆路由器

回答

相关问题