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. C#跨线程调用窗体控件(比如TextBox)引发的线程安全问题

    如何:对 Windows 窗体控件进行线程安全调用 访问 Windows 窗体控件本质上不是线程安全的. 如果有两个或多个线程操作某一控件的状态,则可能会迫使该控件进入一种不一致的状态. 还可能会出现 ...

  2. C# 装箱和拆箱[整理](转)

    //1. // 装箱和拆箱是一个抽象的概念 //2. // 装箱是将值类型转换为引用类型 :拆箱是将引用类型转换为值类型 // 利用装箱和拆箱功能,可通过允许值类型的任何值与Object 类型的值相互 ...

  3. SVN图标不显示的解决几种方式

    系统安装的Tortoise SVN,不知道是不是安装了其他软件的缘故,造成SVN客户端功能可以正常使用,就是文件夹或文件的左下角不显示图标.故上网查找解决方法: 方法一: 升级到最新版本,基本是没用的 ...

  4. java获取每月的最后一天

    public static void main(String[] args) throws ParseException { // 获取当月的天数(需完善) SimpleDateFormat date ...

  5. 新特性之MAPI over HTTP \ 配置 MAPI over HTTP

    Exchange 2016 中的 MAPI over HTTP https://docs.microsoft.com/zh-cn/Exchange/clients/mapi-over-http/map ...

  6. 进制转换excel版

  7. August 05th 2017 Week 31st Saturday

    All endings are beginnings, we just don't know it at the time. 所有的结局都是新的开始,只是当时我们不知道而已. Several mont ...

  8. BZOJ 1088 扫雷Mine 枚举初始状态

    题目链接: https://www.lydsy.com/JudgeOnline/problem.php?id=1088 题目大意: 现在棋盘是n×2的,第一列里面某些格子是雷,而第二列没有雷,如下图: ...

  9. URAL-1019 Line Painting----暴力或线段树

    题目链接: https://cn.vjudge.net/problem/URAL-1019 题目大意: 一个0~1e9的区间,初始都是白的,现进行N次操作,每次将一段区间图上一中颜色.最后问说连续最长 ...

  10. FP又称为Monadic Programming

    什么是Monad? trait Monad[+T] { def flatMap[U]( f : (T) => Monad[U] ) : Monad[U] def unit(value : B)  ...