Angular：具有管理员后端的应用的正确项目结构

Question

我是Angular的新手，我刚读完“ ng-book：有关Angular 6的完整书”。

我目前有一个简单的问题，找不到合适的答案。

我想构建一个像这样的应用程序：

MainLayout：所有主要网站页面的基本布局。漂亮的页眉，页脚等 AdminLayout：基本布局所有管理页面。另一个带有左侧边栏的标题。

http://my-app.com：具有多个路由的应用程序。所有路线共享相同的基本布局（MainLayout）

http:///my-app.com/admin：相同的应用程序，相同的后端，但是使用的布局与主网站（AdminLayout）不同，但是/ admin的所有子路由都共享相同的布局（AdminLayout）。

我可以做什么：

• 应用
  • 管理员
    • admin.module.ts（定义管理路由）
    • admin.component.ts（并且html具有路由器出口）
  • 主要
    • main.module.ts（定义主要路线）
    • main.component.ts（并且html具有路由器出口）
  • app.module.ts（带有路由器/空路由）
  • app-routing.component.ts（带有路由器出口）

这是正确的方法吗？

谢谢

Answer 1

您当前的实现是完美的。我还想添加其他一些东西。

请确保所有您已经说过的主布局以及管理布局中的路由都被延迟加载。

因此，理想情况下，对于要创建的每个路由，都必须创建一个模块和一个路由模块。这些路由以及将作为这些主要组件的一部分（在路由配置中指定）呈现的组件和子组件将驻留在模块文件夹中。

如果您认为有一些组件将在整个应用程序中重用，请考虑添加SharedModule并export将其作为其中的一部分。

此外，由于页眉和页脚是一次性组件，因此我认为您应该考虑将它们移至CoreModule，然后将CoreModule导入到AppModule中。

所有这些建议均与您可能想通读的Angular Style Guide一样。