【亲测可用→防止入坑Routes】设置angular10项目异步加载、惰性加载、懒加载路由
创建一个带路由的项目，依次执行下面每行代码
ng n RouingApp --routingcd RouingAppng g c components/firstng g c components/secondng g m components/second --routing
代码拷贝：
import {NgModule} from '@angular/core';
import {RouterModule, Routes} from '@angular/router';
import {SecondComponent} from "./second.component";const routes: Routes = [{path: '',//默认被异步加载该模块的时候自动引入SecondComponentcomponent: SecondComponent,},
];@NgModule({imports: [RouterModule.forChild(routes)],//注意用于懒加载的模块必须是forChild方式引入exports: [RouterModule]
})
export class SecondRoutingModule {
}
代码拷贝：
import {NgModule} from '@angular/core';
import {Routes, RouterModule} from '@angular/router';
import {FirstComponent} from './components/first/first.component';
import {ChildComponent} from './components/first/child/child.component';
import {PageNotFoundComponent} from './components/first/pageNotFound.component';const routes: Routes = [{path: '',redirectTo: 'first',pathMatch: 'full'},{path: 'first',component: FirstComponent,//同步加载//子路由children: [{path: 'child',component: ChildComponent,}]},{path: 'second',// loadChildren: './components/second/second.module',//异步加载、惰性加载、懒加载（已失效）loadChildren: () => import('./components/second/second.module').then(m => m.SecondModule),//异步加载、惰性加载、懒加载},{ path: '**',component: PageNotFoundComponent //当输入路由错误的时候跳转到此页面}
];@NgModule({imports: [RouterModule.forRoot(routes)],exports: [RouterModule]
})
export class AppRoutingModule {
}
把app.component.html代码改成如下
<button routerLink="/">跳转到first</button> <button [routerLink]="['/']">跳转到first</button><br><br><button routerLink="/second">跳转到second</button> <button [routerLink]="['/second']">跳转到second</button><br><br><router-outlet></router-outlet>运行项目
ng s --open访问http://localhost:4200就可以了
【亲测可用→防止入坑Routes】设置angular10项目异步加载、惰性加载、懒加载路由相关推荐
- centos7.4.3 部署python-pcl亲测可用（采坑记）
最近工作里用到PCL库,处理点云数据.点云抽稀能极大的减少点云数据. 通过python-pcl调用C++的PCL库.windows下运行ok,linux下部署踩了很多坑,试了多种办法,包括源码安装,都 ...
- 超级简单的自动刷新_支付宝自动收取能量、偷能量、超级简单教程，荣耀V20亲测可用...
关键信息 作者:狐仙小妲己 教程地址:https://m.lizhiweike.com/channel2/887975 源码地址:https://github.com/Xiao-DaJi/alipay ...
- 不用再找了，支付宝自动收取能量、自动偷能量、超级简单的系统教程在这里，华为荣耀V20亲测可用
关键信息 作者:狐仙小妲己 视频教程地址:https://m.lizhiweike.com/lecture2/18061021 源码地址:https://github.com/Xiao-DaJi/al ...
- idea2017激活方式（亲测可用，良心推荐）
今天打开电脑,非常不幸,idea出问题了!!! 大部分人以前应该都是用的以下方法: 1. 到网站 http://idea.lanyus.com/ 获取注册码 2.填入下面的license server ...
- MAC地址修改方法（解决teamviewer访问超时限制的问题）亲测可用（文后有惊喜）
个人笔记本windows8.1的系统(windows10应该也可以)各种操作,不能成功.最后通过注册表修改后成功的. (我笔记本一直连的是无线,现在看来不是无线和有线的问题) 解决teamviewer ...
- PDF转word并去除水印以及处理的页数限制【pdf转word可编辑 百分百还原文件 亲测可用】
提示:操作aspose-pdf-22.10-jdk16.jar 对其重编译修改校验权限 使用javassist 重编译(学习测试使用,aspose所有的包都可以用该教程.亲自测试过的) 文章目录 前言 ...
- 苹果ios 11系统无法连接服务器,ios11 App Store无法连接解决办法，亲测可用
原标题:ios11 App Store无法连接解决办法,亲测可用 之前咱们公众号:果粉之家曾多次介绍过IOS11的新功能,包括:加入蜂窝数据开关,可自定义控制中心,支持屏幕录像,支持GIF动图,可以设 ...
- vue3+elementPlus主题动态切换2022，亲测可用！
环境 系统: win10 64 node版本 v16.13.2 vue: ^3.2.33 element-plus: ^2.2.0 开始 在线 预览效果 || git仓库地址 本文换肤的实现思路是手动 ...
- Spoon/Kettle 连接sqlserver数据库遇到的问题 （亲测可用，图文讲解）
本文涉及到的错误: Spoon/Kettle 连接sqlserver数据库遇到的问题 (亲测可用,图文讲解) [IM002][Microsoft][ODBC 驱动程序管理器]未发现数据源名称并且未指定 ...
最新文章
- 宏基因组数据提交GSA实操手册—发表文章前必备技能
- 记一次升级Oracle驱动引发的死锁
- Linux-NTP-Server+Client
- C语言 将程序运行的时间记录在记事本中，下次运行进行读取
- 事物的开始和结束命令分别是什么_人教版小学四年级语文下册期末测试题及答案[1]...
- View controller-based status bar
- 为什么事务日志自动增长会降低你的性能
- ubuntu 安装 mysql debug_ubuntu 安装phpstorm+xdebug 动态调试环境
- 用GoEasy实现websocket
- 怎么用计算机解锁手机密码华为,华为手机忘记解锁密码如何解锁？两招轻松搞定...
- PHP生成海报/PHP合并图片/PHP图片处理
- DUTOJ1205（大数）
- RNA编辑基本形式与相关技术的研究现状（阅读小结）
- Tensorflow 笔记 Ⅱ——单变量线性回归
- 必备模块知识——继电器
- 应用层: HTTP 与 HTTPS协议
- 运行tomcat7w.exe tomcat7.exe ,提示 指定的服务未安装 unable to open the service 'tomcat7'
- 【MOOC嵩天Python语言程序设计】第9周 Python计算生态概览
- C语言程序设计——冒泡排序
- （数学建模）2013年国赛B题-碎纸片复原python代码
热门文章
- 【一】TSP、VRP、VRP模型介绍
- python+opencv选出视频中一帧再利用鼠标回调实现图像上画矩形框
- Leetcode 50. Pow(x, n)
- linux的tar中ztvf,linux中的tar命令(2)
- OpenCV+python：模板匹配
- perl语言编程 第四版_2020年，5 种 将死的编程语言！
- rn php,rn怎样在PHP的正则表达式中匹配到？
- php url模式在哪修改,如何在nginx环境中启用php的pathinfo URL模式[修正]
- python-docx表格设置实线_python docx加入表格 在表格中加图，设置框线
- java 获取linux mac_java在linux获得ip地址和mac