博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
使用Angular CLI生成路由
阅读量:6334 次
发布时间:2019-06-22

本文共 1064 字,大约阅读时间需要 3 分钟。

第一篇文章是: "使用angular cli生成angular5项目" : 

第二篇文章是: "使用angular cli从蓝本生成代码" : 

 

我们知道使用 ng g module admin 将会生成admin module.

而使用 ng g m sales --routing 则将会生成sales和 sales-routing 两个module.

sales-routing里面就是路由的信息, 并且它被import到了sales module 里面.

为应用生成路由.

先创建一个项目:

ng new my-routing --routing

 

可以看到生成了两个module.

看一下routing module:

再看一下app module:

已经把AppRoutingModule import了进来.

再看一下app.component.html:

router-outlet已经写上了. 很好.

下面再生成两个components:

ng g c dashboardng g c order

 

然后在app-routing.module里面设置路由:

再修改一下html:

运行一下应用: ng serve -o

嗯. 没问题.

 

 针对一个应用里面有多个module的情况.

再生成一个module, 并且带着路由module (可以先使用-d参数查看将要生成的文件):

ng g m admin --routing

 

在admin module里面, 再创建一个admin component:

ng g c adminng g c admin/email -m adminng g c admin/user -m admin

 

实际上后两个命令的-m参数可以去掉, 因为已经指定了路径 admin/, 这样默认就会在 admin module里面进行声明而不是app module.

随后需要修改app.module:

把admin module加入进去.

然后修改admin.component.html, 加入router-outlet:

然后修改admin-routing.module.ts:

运行: ng serve -o

直接输入地址: http://localhost:4200/admin

可以看到:

而输入网址: http://localhost:4200/admin/email

则会看到:

所以没问题.

 

生成Gurad.

ng g guard xxx

 

这个命令将会生成xxx.guard.ts

 

转载地址:http://ddioa.baihongyu.com/

你可能感兴趣的文章
字符串与整数之间的转换
查看>>
断点传输HTTP和URL协议
查看>>
redis 数据类型详解 以及 redis适用场景场合
查看>>
mysql服务器的主从配置
查看>>
巧用AJAX技术,通过updatePanel控件实现局部刷新
查看>>
20140420技术交流活动总结
查看>>
SaltStack配置salt-api
查看>>
各种情况下block的类型
查看>>
ThinkPHP 3.2.x 集成极光推送指北
查看>>
js作用域链
查看>>
java中如何选择Collection Class--java线程(第3版)
查看>>
为运维人员插上腾飞更远的翅膀!
查看>>
Word 2003中编辑标记与格式标记大讨论
查看>>
从国内向海外转移域名经验谈
查看>>
浅谈apache与tomact的整合
查看>>
SQL Server vNext CTP1 on Linux
查看>>
1-为 Lync Server 2010 准备 Active Directory 域服务
查看>>
NetBackup下ORACLE恢复测试方案实例解析
查看>>
【有奖征文】“失业”程序员的苦辣酸甜
查看>>
IE9是如何被FireFox4超越全球市场份额的?
查看>>