In entity.module.ts
,到实体的路由被添加到RouterModule.forChild()
:所有实体都将延迟加载。
这意味着在客户端(浏览器)中加载的 JHipster 创建的 Angular 应用程序的初始部分不具有应用程序的所有路径和所有模块。 Angular 应用程序中唯一的 Angular 路由器对象最初只知道在RouterModule.forRoot()
in app-routing.module.ts
(导入为[AppName]AppRoutingModule]
in app.module.ts
) and navbar.route.ts
(链接在app-routing.module.ts
).
The entity.module.ts
本身被导入为[AppName]EntityModule
in app.module.ts
因此它的RouterModule.forChild()
-从客户端浏览器中的应用程序启动开始,Angular Router-Object 就知道条目。
这样,客户端上的 Angular Router-Object 将只知道路径以及如何导航到已实现的实体模块(意味着:如何在 SPA 屏幕上加载实体组件),因此只会在如果该实体被“延迟加载”访问,则相应的js
-数据从网络服务器到客户端(浏览器)。 Angular 在转译时将这些数据打包在 JavaScript 块中,因此可以单独加载相应的附加数据。
在每个 JHipster webapp 实体文件夹中,您都会找到一个[entity].route.ts
,由相应的导入[entity].module.ts
.
因此,一旦通过路径访问其中一个实体组件,客户端上的 Angular Router-Object 就会获取更多信息(路径),以及如何加载其他 Angular 组件(一个完整的 JHipster 创建的实体)loadChildren
in RouterModule.forChild
.
These 功能模块组件模板然后将在path: ''
(分别path: ':id/view'
, path: ':id/edit'
, path: ':id/new'
)添加到它们来自的根路径:<base href="/" />
(from index.html
) + ./[entity]/
(from entity.module.ts
).
与相应的插座名称(如果命名)一起,还会为 JHipster 应用程序的前端 Angular 端生成路由防护和 pageTitles 以及单独的附加路由参数。 JHipster 目前生成两个<router-outlet>
s:一个用于页面顶部的导航栏(这是指定的)和主导航栏<router-outlet>
.