此处介绍三种方式

方式一:

     问号后面带的参数,

        例如:/product?id=1&name=iphone还可以是: [routerLink]="['/books']" [queryParams]="{bookname:'《活着》'}

             获取参数的方式:ActivatedRoute.queryParams[id]

方式二:

     冒号形式,

        例如:path:/product/:id

        获取参数的方式:ActivatedRoute.params[id]

方式三:

     js里的路径跳转

        例如:path:/product,component:ProductComponent,data:[{madeInChina:true}]}

        获取参数的方式: ActivatedRoute.snapshot.data[0][madeInChina]

     

angular5 路由传参的几种方式的更多相关文章

  1. Vue路由传参的几种方式

    原 Vue路由传参的几种方式 2018年07月28日 23:52:40 广积粮缓称王 阅读数 12613   前言:顾名思义,vue路由传参是指嵌套路由时父路由向子路由传递参数,否则操作无效.传参方式 ...

  2. vue路由传参的三种方式以及解决vue路由传参页面刷新参数丢失问题

    最近项目中涉及到跨页面传参数和后台进行数据交互,看到需求之后第一反应就是用路由传参来解决:Vue中给我们提供了三种路由传参方式,下面我们一个一个的来看一下: 方法一:params传参: this.$r ...

  3. vue-router 路由传参的几种方式,刷新页面参数丢失

    常见场景:点击列表详情,跳转到详情内页,传递id参数获取详情数据. 我们先来看看路由跳转的几种方式: 1.通过params方式传参 通过$route.push的path携带参数方式 // 路由配置 { ...

  4. vue路由传参的三种方式区别(params,query)

    最近在做一个项目涉及到列表到详情页的参数的传递,网上搜索一下路由传参,结合自己的写法找到一种适合自己的,不过也对三种写法都有了了解,在此记录一下 <ul class="table_in ...

  5. Vue-router路由传参的三种方式

    本文简单介绍下三种路由传参: (1)在路由中配置 { path : ‘/home/:id’, name : ‘Dome’, component } 然后写调用的时候 this.$router.push ...

  6. vue里面路由传参的三种方式

    1.方式一 通过query的方式也就是?的方式路径会显示传递的参数 HTML的方式<router-link :to="{name:xxx,query:{page:1,code:8899 ...

  7. vue路由传参的三种方式

    方式一 通过query方式传参 这种情况下 query传递的参数会显示在url后面 this.$router.push({ path: '/detail', query: { id: id } }) ...

  8. React中使用 react-router-dom 路由传参的三种方式详解【含V5.x、V6.x】!!!

    路由传值的三种方式(v5.x) params参数 //路由链接(携带参数): <Link to='/demo/test/tom/18'}>详情</Link> //或 <L ...

  9. react --- 路由传参的几种方式

    1.params 优势 : 刷新地址栏,参数依然存在缺点:只能传字符串,并且,如果传的值太多的话,url会变得长而丑陋. 2.query 优势:传参优雅,传递参数可传对象:缺点:刷新地址栏,参数丢失 ...

随机推荐

  1. AnsiString和各种数据类型间相互转换 [数据转换]

    //Ansistring 转 char void __fastcall TForm1::Button1Click(TObject *Sender) { AnsiString Test = " ...

  2. Vue.js学习笔记——表单控件实践

    最近项目中使用了vue替代繁琐的jquery处理dom的数据更新,个人非常喜欢,所以就上官网小小地实践了一把. 以下为表单控件的实践,代码敬上,直接新建html文件,粘贴复制即可看到效果~ <! ...

  3. 剑指offer4

    中序遍历(LDR)是二叉树遍历的一种,也叫做中根遍历.中序周游.在二叉树中,先左后根再右.巧记:左根右. 现在有一个问题,已知二叉树的前序遍历和中序遍历:PreOrder:         GDAFE ...

  4. POJ 分类

    初期: 一.基本算法:      (1)枚举. (poj1753,poj2965)      (2)贪心(poj1328,poj2109,poj2586)      (3)递归和分治法.      ( ...

  5. sql性能优化(摘自网络)

    索引,索引!!!为经常查询的字段建索引!! 但也不能过多地建索引.insert和delete等改变表记录的操作会导致索引重排,增加数据库负担. 优化目标 1.减少 IO 次数 IO永远是数据库最容易瓶 ...

  6. mysql数据安装问题汇总

    1.mysql安装冲突:conflicts with file from package 看到“conflicts”,是产生冲突了,文件“/usr/share/mysql/charsets/*”需要M ...

  7. Java SE 基础知识(String,Array)

    String 类: 1. 对于String对象的相等性判断来说,请使用equals()方法,而不是==.String的equals()是判断当前字符串与传进来的字符串的内容是否一致. 2. Strin ...

  8. Linux服务器配置---ntp

    配置ntp     ntp就是网络时间同步的服务,时间的准确性非常重要,很多数据在记录时都要知道准确的时间.网上有很多站点,一般国内会设置匹配中科院国家授时中心的时间. 1.安装ntp软件 [root ...

  9. HTML5代码规范

    HTML5代码规范html标签里面等号两边不要留空格在IE下可能会识别不了html5等号前后可以使用空格,但仍不推荐使用. HTML 代码约定很多 Web 开发人员对 HTML 的代码规范知之甚少.在 ...

  10. python3.4学习笔记(十) 常用操作符,条件分支和循环实例

    python3.4学习笔记(十) 常用操作符,条件分支和循环实例 #Pyhon常用操作符 c = d = 10 d /= 8 #3.x真正的除法 print(d) #1.25 c //= 8 #用两个 ...