专业编程教程与实战项目分享平台

网站首页 > 技术文章 正文

Angular五部曲之懒加载 angular5

ins518 2024-10-07 13:27:31 技术文章 12 ℃ 0 评论

前言

在默认的情况下,NgModule 是急性加载的,在应用加载时会尽快加载,不管模块是否会立即使用,所有的模块都是如此。对于使用了很多路由、有很多模块的大型应用来说,使用惰性加载会减小初始包的代码体积,从而减少加载时间。

建立一个惰性加载的特性模块的步骤:

  1. 创建模块。
  2. 创建改模块的路由模块。
  3. 配置路由。

创建应用

首先创建一个应用 lazy-module

ng new lazy-module

创建应用成功后,cd lazy-module

创建2个惰性模块

ng generate module customer1 --routing
ng generate module customer2 --routing

在模块中添加组件

写界面

编辑 app.component.html 页面

配置路由

编辑 app-routing.module.ts 文件

编辑 customer1-routing.module.ts 文件

编辑 customer2-routing.module.ts 文件

运行

本文暂时没有评论,来添加一个吧(●'◡'●)

欢迎 发表评论:

最近发表
标签列表