子路由是相对路由

路由配置部分:

主要是children

const routes: Routes = [
{path:'home', component: HomeComponent,
  children:[
    {
    path:'homeDetail/:id',
    component:HomeMenuComponent
    },{
    path:'',
    component:HomeListComponent
    }
  ]
]
第一种是通过标签跳转
这里是./(相对路径)不是/(绝对路径)
 
<a [routerLink] = "['./homeDetail',10]">haha</a>
第二种是点击按钮通过Router路由子界面
 
import { Router,ActivatedRoute } from "@angular/router";
 
constructor(private router: Router,private routeInfo:ActivatedRoute){}
 
 
 
nav():void {
this.router.navigate(['homeDetail',100],{relativeTo:this.routeInfo});
}
 

angular路由详解四(子路由)的更多相关文章

  1. angular路由详解:

    1.$routeProvider ngRoute模块中的服务 2.otherwise:设置用于路由改变时,与任何其他定义的路由无法匹配的时候执行的代码 3.when:为$route服务定义新的路由 例 ...

  2. angular路由详解六(路由守卫)

    路由守卫 CanActivate: 处理导航到某个路由的情况. CanDeactivate:处理从当前路由离开的情况. Resole:在路由激活之前获取路由数据. 1.CanActivate: 处理导 ...

  3. angular路由详解一(基础知识)

    本人原来是iOS开发,没想到工作后,离iOS开发原来越远,走上了前端的坑.一路走来,也没有向别人一样遇到一个技术上的师傅,无奈只能一个人苦苦摸索.如今又开始填angular的坑了.闲话不扯了.(本人学 ...

  4. react router @4 和 vue路由 详解(四)vue如何在路由里面定义一个子路由

    完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html 6.vue如何在路由里面定义一个子路由? 给父路由加一个 children:[] 参考我 ...

  5. angular路由详解五(辅助路由)

    在HTML文件中 //主路由 <router-outlet></router-outlet> //辅助路由 <router-outlet  name="aux& ...

  6. angular路由详解三(路由参数传递)

    我们经常用路由传递参数,路由主要有三种方式: 第一种:在查询参数中传递数据 {path:"address/:id"}   => address/1  => Activa ...

  7. Vue 路由详解

    Vue 路由详解 对于前端来说,其实浏览器配合超级连接就很好的实现了路由功能.但是对于单页面应用来说,浏览器和超级连接的跳转方式已经不能适用,所以各大框架纷纷给出了单页面应用的解决路由跳转的方案. V ...

  8. Ocelot简易教程(三)之主要特性及路由详解

    作者:依乐祝 原文地址:https://www.cnblogs.com/yilezhu/p/9664977.html 上篇<Ocelot简易教程(二)之快速开始2>教大家如何快速跑起来一个 ...

  9. pika详解(四) channel 通道

    pika详解(四) channel 通道   本文链接:https://blog.csdn.net/comprel/article/details/94662394 版权 ​ channel通道 通道 ...

随机推荐

  1. PHP不使用array_merge函数实现一维数组合并

    function array_mer() { $arrays = func_get_args(); //获取当前函数中传递进来的所有参数,也就是所有一维数组 // echo '<pre>' ...

  2. UVA-12166 天平性质+字符处理

    这题思维难度很大,关键是总结这个性质. 1.天平性质:某个秤砣重量为w,高度为h,如果要让这个天平平衡并且以这个秤砣为基准,那么整个天平的总重量为w*(2^h) 2.利用这个性质:题目要求秤砣数量改变 ...

  3. H3C交换机的端口隔离

    H3C端口隔离 1.同一个VLAN下隔离物理端口 2.在隔离组中的端口不能相互访问 3.隔离组内的端口,可以与同一VLAN下的其他端口通信 配置: [H3C]port-isolate group 1 ...

  4. 用Node.JS+MongoDB搭建个人博客(页面模板)(五)(结束)

    <差不多先生> 我是差不多先生,我的差不多是天生.也代表我很天真,也代表我是个闲人.这差不多的人生,总是见缝插针. 求学的道路上总是孤独的,即使别人不理解我,认为我是奇葩!但没关系,我会坚 ...

  5. u盘安装ubuntu10.04 、11.04 server

    10.04 先将 ubuntu server 的 iso 放到优盘上,然后在提示无法找到光驱时,按 alt+f2 打开一个新的 console 窗口,将 iso mount 上,具体操作如下: ls ...

  6. hi3531spi flash启动和bootrom启动的对比

    a

  7. 判断一个jquery对象是否为空

    今天用jquery $获取一个jquery对象.$("#id") 然后用判断这个对象是否存在,id不存在的时候,判断这个是否存在, if($("#id")) 始 ...

  8. XP硬盘读写速度很慢的解决方法

    05购入的电脑,今日仍在发挥余热,但系统速度慢得出奇.今日检测了硬盘读写速度还不到2m/s,实在令人难以接受.一查之下,硬盘被置为PIO模式了,难怪. 用以下方法得以解决: 1.对桌面"我的 ...

  9. 决策树之ID3、C4.5、C5.0等五大算法

    每每以为攀得众山小,可.每每又切实来到起点,大牛们,缓缓脚步来俺笔记葩分享一下吧,please~ --------------------------- C5.0决策树之ID3.C4.5.C5.0算法 ...

  10. TortoiseSVN设置忽略文件和目录文件夹

    TortoiseSVN设置忽略文件和目录文件夹  在多数项目中你总会有文件和目录不需要进行版本控制.这可能包括一些由编译器生成的文件,*.obj,*.lst,或许是一个用于存放可执行程序的输出文件夹. ...