1、首先使用  ng g c , ng g m创建组件及路由

angularjs2 简单的路由跳转

创建之后、会发现app.module.ts中已经导入了,如果没有就自己手动导入

angularjs2 简单的路由跳转

2、编辑路由

angularjs2 简单的路由跳转

3、app中在导入appModuleRoutesModule

angularjs2 简单的路由跳转

4、在app.html中写页面

angularjs2 简单的路由跳转

5、查看浏览器

默认跳转到heroes

angularjs2 简单的路由跳转

点击“危机中心”

angularjs2 简单的路由跳转

angularjs2 简单的路由跳转

输入不存在的路由

angularjs2 简单的路由跳转

发现路由上的地址已经变化了,页面内容也变化了

这只是一个非常简单的路由跳转,以后会更新路由的传参,守卫等。

相关文章: