angular4 在页面跳转的时候传递多个参数到新页面
页面跳转
router.navigate
//单一参数:
this.router.navigate(['/detail',id]); //多个参数:
this.router.navigate(['/detail'],{queryParams:{'name':'nihao'}}); router.navigateByUrl //单一参数:
this.router.navigateByUrl('/detail/id'); //多个参数:
this.router.navigateByUrl('/detail',{queryParams:{'name':'nihao'}});
在新页面接收参数
//1.snapshot
import { ActivateRoute } from '@angular/router';
public data: any;
constructor( public route: ActivateRoute ) { };
ngOnInit(){
this.data = this.route.snapshot.params['id'];
};
//2.queryParams
import { ActivateRoute } from '@angular/router';
public data: any;
constructor( public activeRoute:ActivateRoute ) { };
ngOnInit(){
this.activeRoute.queryParams.subscribe(params => {
this.data = params['name'];
});
};
angular4 在页面跳转的时候传递多个参数到新页面的更多相关文章
- Android first --- 页面跳转及数据传递
页面跳转即数据传递 创建第二个界面Acivity *需要在清单文件中添加配置一个Actuvity标签 标签中如果带有这个子节点,则会在Android中添加一个快捷图标 <intent-filte ...
- 【问题】Asp.net MVC 的cshtml页面中调用JS方法传递字符串变量参数
[问题]Asp.net MVC 的cshtml页面中调用JS方法传递字符串变量参数. [解决]直接对变量加引号,如: <button onclick="deleteProduct('@ ...
- iOS页面跳转及数据传递
转: http://blog.csdn.net/wang9834664/article/details/8025571 iOS页面跳转: 第一种 [self.navigationController ...
- 微信小程序 页面跳转navigator与传递参数
页面之间跳转使用 navigator标签,wx.navigateTo ,wx.redirectTo 1.URL就是跳转的页面路径.上面代码中就是navigator目录下的navigator页面,tit ...
- Android应用开发基础之六:页面跳转和数据传递
创建第二个Activity 需要在清单文件中为其配置一个activity标签 标签中如果带有这个子节点,则会在系统中多创建一个快捷图标 <intent-filter> <action ...
- android 学习随笔十四(页面跳转与数据传递)
1.activity 创建第二个Activity 需要在清单文件中为其配置一个activity标签 标签中如果带有这个子节点,则会在系统中多创建一个快捷图标 <intent-filter> ...
- Android初级教程理论知识(第五章页面跳转和数据传递)
总体概述: Android四大组件 Activity BroadCastReceiver Service ContentProvider 创建第二个activity 新创建的activity,必须在清 ...
- jqgrid如何在一个页面点击按钮后,传递参数到新页面
利用 Content/Scripts/dw-framework.js 中的AddTableMenu属性 <div class="Task" style="backg ...
- 在页面跳转的时候,在跳转后的页面中使用js 获取到 页面跳转的url中携带的参数。
common.js代码 //获取URL中的参数..等等function getQueryString(name){var reg = new RegExp("(^|&)"+ ...
随机推荐
- AutoFac文档12(转载)
目录 开始 Registering components 控制范围和生命周期 用模块结构化Autofac xml配置 与.net集成 深入理解Autofac 指导 关于 词汇表 Resolve的参数 ...
- eclipse中maven插件,改变默认仓库位置
一.eclipse中maven默认仓库是当前用户下.m2/repository,需改变默认路径按照下面步骤. 步骤一:安装maven 下载:http://maven.apache.org/ 配置mav ...
- C编程测试存储格式为大段还是小段
目前,计算机存储系统有2种存储格式,大端和小端.数据在内存中存储时以字节为单位,一个int类型有4个字节,这就导致是高字节对应低地址(大端模式),高字节对应高地址(小端模式).大端和小端模式本身没有对 ...
- atitit.为什么笔记本跟个手机不能组装而pc可以
atitit.为什么笔记本跟个手机不能组装而pc可以 1. 标准程度差 1 2. 为什么标准程度差 1 3. 第一个答案是「能」.第二个答案是「麻烦」. 2 4. 为什么手机不能自定义组装 3 1. ...
- 如何利用dex2jar反编译APK
工具/原料 电脑 dex2jar JD-GUI 方法/步骤 1 下载dex2jar和JD-GUI,在参考资料中添加了这两个工具的百度网盘下载地址供读者下载使用(笔者亲测) 2 找到我们准备测试用的ap ...
- 03、矢量图形查询工具(Symbol Unicode)
目前的软件开发中,很多地方都使用到了矢量图标,在 Metro app 的开发中,可以使用 Windows 系统图标(02.Universal app 中按钮图标使用 ),包括 Segoe UI Sym ...
- Nginx设置expires设定页面缓存时间 不缓存或一直使用缓存
配置expires expires起到控制页面缓存的作用,合理的配置expires可以减少很多服务器的请求 要配置expires,可以在http段中或者server段中或者location段中加入 l ...
- Ubuntu12.04 修复GRUB
电脑安装了双系统,本来好好的GRUB管理启动,在重装过之后就只能进win7了,所以尝试将GRuB重新安装到mbr,使用GRUB作为启动管理程序. 1.制作U盘系统 使用软碟通,讲Ubuntu12.04 ...
- python操作excel之 模块 xlrd (详解)
二.使用介绍 1.导入模块 import xlrd 2.打开Excel文件读取数据 data = xlrd.open_workbook('excelFile.xls') 3.使用技巧 获取一个工作表 ...
- 商派onex本地部署无法进入的问题
商派最新版的ONex本地虚拟机部署项目无法进入注册的问题解决 进入项目的database.php文件,复制host的值 vim /etc/hosts,将hosts内容添加到/etc/hosts里面去就 ...