一些功能模块的具有公共布局的角度布线

我有一个有3个用户角色的Angular7应用程序,A,B&C。A&B共享相同的视觉布局,但菜单项发生了变化(主题和结构相同,数据不同)。C的布局完全不同。

我的申请有 AppModule , SharedModule , CoreModule , HomeModule , AModule , BModule 和; CModule . 我的公共布局位于一个名为 CommonLayoutComponent 从哪个出口 共享模块 在模块A和B中使用。

工作流:用户登录到一个有三个按钮的主页上,该按钮将路由到模块A、B和C,或者她可以通过在相关的URL上加上书签直接导航到正确的模块。

我的app-routing.module.ts

const routes: Routes = [
  { path: '', redirectTo: '/home', pathMatch: 'full' },
  { path: 'home', component: HomeComponent },
  { path: 'a', component: AComponent },
  { path: 'b', component: BComponent },
  { path: 'c', component: CComponent }
];
@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

问题:

1. 我还需要引导吗 AppComponent 在我的AppModule中,即使除了 <router-outlet></router-outlet> 在app.component.html中?
2. 我怎么治疗我的 公共布局组件 作为母版页/布局页(如ASP.NET MVC布局页)并弹出我的 <路由器插座></路由器插座> 里面是模块A和B?