1.首先是需要导入的模块

import { Router } from "@angular/router";//路由传参用到

import{ActivatedRoute,Params} from  '@angular/router';//获取路由传参用到

2.第二步,注入服务

constructor( private activateInfo:ActivatedRoute
private router:Router
)

路由传参的方法

this.router.navigate(['/product/commodity/edit'], {
queryParams: {
id: res.data,
type: 'clone'
}
})

获取路由传参的办法

constructor( private activateInfo:ActivatedRoute
private router:Router
) {
    activateInfo.queryParams.subscribe(queryParams => {
let Id = queryParams.id;
let type = queryParams.type;)}

}

这个要获取的路由参数如图

可以看出来  id和type字段是从url里拿到的参数

  

angular路由传参和获取路由参数的方法的更多相关文章

  1. vue 路由传参中刷新页面参数丢失 及传参的几种方式?

    在页面跳转中,我通过路由传参,结果发现页面参数丢失了.路径返回了根目录.... 1. 先说下路由传参的几种方式吧? 比如:<div v-for="item in items" ...

  2. Vue 路由的简单使用(命名路由、query路由传参、params路由传参)

    1 # Vue 路由 2 # 1.理解:一个路由(toute)就是一组映射关系(key-value),多个路由需要路由器(router)进行管理 3 # 2.前端路由:key是路径,value是组件 ...

  3. Vue中this.$router.push参数获取(通过路由传参)【路由跳转的方法】

    传递参数的方法: 1.Params 由于动态路由也是传递params的,所以在 this.$router.push() 方法中 path不能和params一起使用,否则params将无效.需要用nam ...

  4. vue-router2.0 组件之间传参及获取动态参数

    <li v-for=" el in hotLins" > <router-link :to="{path:'details',query: {id:el ...

  5. asp.net 通过ajax方式调用webmethod方法使用自定义类传参及获取返回参数

    实体类    public class User    {        public int Id { get; set; }        public string Name { get; se ...

  6. vue 路由传参 以及获取参数

    1.通过query实现: <router-link :to="{ name:'home',query:{id:1} }">跳转页面</router-link> ...

  7. vue路由传参和获取参数

    参考链接 https://router.vuejs.org/zh/guide/essentials/passing-props.html#%E5%B8%83%E5%B0%94%E6%A8%A1%E5% ...

  8. Vue路由传参及传参后刷新导致参数消失处理

    项目功能需要,要从列表页跳转到第三方提供的URL上(这里第三方页面我是通过iframe引入在详情页,目的是点击返回时可以通过keepAlive让列表页不刷新,如果不通过iframe直接跳第三方链接,那 ...

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

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

随机推荐

  1. 地图的平移、缩放的实现(android版)

    一.平移地图 移动地图的原理是利用手指在屏幕上拖动的距离,转换为在地图上距离,把地图坐标加上偏移的距离实现地图移动. 由于地图是绘制到Bitmap上的,所以地图移动和缩放的过程只要改变Bitmap的矩 ...

  2. Android BitmapFactory.Options

    public Bitmap inBitmap 如果设置,解码选项“对象的方法,采取将尝试重用这个位图加载内容时. public int inDensity 使用的位图的象素密度. public boo ...

  3. Unihan(统汉字)常用字段介绍

    0 背景 1 文件 1.1 IRG Sources 1.2 Dictionary Indices 1.3 Dictionary-like Data 1.4 Other Mappings 1.5 Rad ...

  4. xshell5 可用注册码

    101210-450789-147200(可以激活Xshell5,而且可以升级) 亲测可用 只能用于xshell5

  5. 沉淀再出发:再谈java的多线程机制

    沉淀再出发:再谈java的多线程机制 一.前言 自从我们学习了操作系统之后,对于其中的线程和进程就有了非常深刻的理解,但是,我们可能在C,C++语言之中尝试过这些机制,并且做过相应的实验,但是对于ja ...

  6. [Vijos 1768] 顺序对的值

    顺序对的值 描述 给定一个序列a,a中任意两个元素都不等.如果i<j,且a[i]<a[j],则我们称a[i],a[j]为一个顺序对,这个顺序对的值是指a[i+1],a[i+2]…….a[j ...

  7. C++课堂作业(2)

    github的链接: https://github.com/deepYY/object-oriented/tree/master/PAT.1025 题目 给定一个常数K以及一个单链表L,请编写程序将L ...

  8. Spring配置文件中的parent与abstract

    在看项目的Spring配置文件时,发现消息队列的配置采用了继承方式配置Bean,在这梳理总结一下. 其实在基于spring框架开发的项目中,如果有多个bean都是一个类的实例,如配置多个数据源时,大部 ...

  9. 如何实现本机Windows连接虚拟机中的CentOS

    1.确定CentOS的IP地址,命令为 ifconfig,由此可知,LinuxIP地址为 192.168.85.128 2.WIndows的IP地址为192.168.16.1, 3.保证CentOS和 ...

  10. BZOJ 1001 狼抓兔子 平面图的最小割

    题目链接: https://www.lydsy.com/JudgeOnline/problem.php?id=1001 题目大意: 见链接 思路: 求最小割,平面图的最小割等价于对偶图的最短路 直接建 ...