Angular2 路由传值

在接收值得组件里面导入ActivatedRoute

路由设置页面传参

{ path: 'view/:mid' , component: ViewComponent},

父级页面路由跳转的实现

<div [routerLink]="['/email/view',mail.id]">页面跳转传值</div>

子页面的Component通过下面的方法可以获取到父页面路由传过来的参数<b>mail.id</b>

//

import { Component, OnInit } from '@angular/core';
import {ActivatedRoute} from "@angular/router";

@Component({
  selector: 'app-view',
  templateUrl: './view.component.html',
  styleUrls: ['./view.component.scss']
})
export class ViewComponent implements OnInit {

  constructor(public route: ActivatedRoute) {

        //通过这种形式来接收父级页面传过来的值
        this.route.params.subscribe(data=>console.log(data.mid))

        //或者通过
        this.route.params['value']['mid']
   }

  ngOnInit() {
  }

}

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏木子昭的博客

少写css, 早下班! Antd完成todo-list样式布局

932
来自专栏我和未来有约会

建立可扩展的silverlight 应用框架 step-6

整理导航模块“LeftNav” 首先说一下我想要实现的效果。 我希望在左侧的导航点击了以后右侧的主体部分发声变化。 之前我在LeftNav模块用的控件是Togg...

21610
来自专栏行者常至

014.golang 并发concurrency

1114
来自专栏Google Dart

AngularDart 4.0 高级-生命周期钩子 顶

Angular创建它,渲染它,创建和渲染它的子项,在数据绑定属性发生变化时对其进行检查,并在将它从DOM中删除之前对其进行销毁。

1181
来自专栏君赏技术博客

Jekyll-Admin-Mac-模板处理

制作导航条 使用网络框架Alamofire 使用 SwiftyJSON iOS10开启启用 HTTP 请求 使用 ObjectMapper ...

1143
来自专栏Python绿色通道

Python爬虫:现学现用xpath爬取豆瓣音乐

爬虫的抓取方式有好几种,正则表达式,Lxml(xpath)与BeautifulSoup,我在网上查了一下资料,了解到三者之间的使用难度与性能

2223
来自专栏前端大白专栏

angular2 路由问题

1825
来自专栏开心的学习之路

02 Jmonkey3.2.0+Nifty1.4.2实现GUI

GUI选择 实现Jmonkey的GUI有三四种方式,我尝试了三种,有 Lemur tonegod nifty 最终选择了Nifty, 因为Lemur用java语...

5178
来自专栏一“技”之长

Bootstrap响应式前端框架笔记二十——工具条的应用

    工具条用于向用户进行某个操作的提示,在Bootstrap框架中,为按钮添加工具条十分简单,只需如下代码:

842
来自专栏木子昭的博客

Redux实现组合计数器

1093

扫码关注云+社区

领取腾讯云代金券