前言：

随着ITOO项目的深入，前端框架Angular的应用也在不断加深，路由的跳转分为两个部分，一个是代码跳转，另外一个是指令跳转。此篇是继上次代码跳转的姊妹篇。接下来请听小编娓娓道来。

正文：

指令跳转

指令跳转是通过使用RouterLink指令来完成的。该指令接收一个链接参数数组，Angular将根据该数组来生成UrlTree实例进行跳转。

目的：

点击左侧栏按钮，跳转相应模块

三步走战略

第一步：配置路由

left-nav.routes.ts

说明：

相应的路由配置其与代码跳转是一致的，差别在于跳转的实现形式。

第二步：配置模块加载文件

left-nav.module.ts

第三步：跳转代码

left-nav.componetn.html

说明：

1.上图中规划出了两种实现指令跳转的形式，在具体实践中都可以运用

2.代码中的链接地址均是从根路由开始，然后具体定位到某模块。

PS：至此就完成了使用指令跳转的路由跳转。

实现如下图所示：

结语：

其实并不难！

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!