页面跳转

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 在页面跳转的时候传递多个参数到新页面的更多相关文章

  1. Android first --- 页面跳转及数据传递

    页面跳转即数据传递 创建第二个界面Acivity *需要在清单文件中添加配置一个Actuvity标签 标签中如果带有这个子节点,则会在Android中添加一个快捷图标 <intent-filte ...

  2. 【问题】Asp.net MVC 的cshtml页面中调用JS方法传递字符串变量参数

    [问题]Asp.net MVC 的cshtml页面中调用JS方法传递字符串变量参数. [解决]直接对变量加引号,如: <button onclick="deleteProduct('@ ...

  3. iOS页面跳转及数据传递

    转: http://blog.csdn.net/wang9834664/article/details/8025571 iOS页面跳转: 第一种 [self.navigationController  ...

  4. 微信小程序 页面跳转navigator与传递参数

    页面之间跳转使用 navigator标签,wx.navigateTo ,wx.redirectTo 1.URL就是跳转的页面路径.上面代码中就是navigator目录下的navigator页面,tit ...

  5. Android应用开发基础之六:页面跳转和数据传递

    创建第二个Activity 需要在清单文件中为其配置一个activity标签 标签中如果带有这个子节点,则会在系统中多创建一个快捷图标 <intent-filter> <action ...

  6. android 学习随笔十四(页面跳转与数据传递)

    1.activity 创建第二个Activity 需要在清单文件中为其配置一个activity标签 标签中如果带有这个子节点,则会在系统中多创建一个快捷图标 <intent-filter> ...

  7. Android初级教程理论知识(第五章页面跳转和数据传递)

    总体概述: Android四大组件 Activity BroadCastReceiver Service ContentProvider 创建第二个activity 新创建的activity,必须在清 ...

  8. jqgrid如何在一个页面点击按钮后,传递参数到新页面

    利用 Content/Scripts/dw-framework.js 中的AddTableMenu属性 <div class="Task" style="backg ...

  9. 在页面跳转的时候,在跳转后的页面中使用js 获取到 页面跳转的url中携带的参数。

    common.js代码 //获取URL中的参数..等等function getQueryString(name){var reg = new RegExp("(^|&)"+ ...

随机推荐

  1. Murano环境搭建、使用介绍和思考

      murano是OpenStack的Application Catalog服务.推崇AaaS(Anything-as-a-Service)的概念.通过统一的框架和API实现应用程序高速部署和应用程序 ...

  2. DDMS android 开发工具-----dump View Hierarchy for UI automator

    今天又发现一个好工具  dump View Hierarchy 对学习UI布局非常有优点,操作也非常easy的.直接上图说话了 watermark/2/text/aHR0cDovL2Jsb2cuY3N ...

  3. Android_WebServices_源代码分析

    本博文为子墨原创,转载请注明出处! http://blog.csdn.net/zimo2013/article/details/38037989 在Android_WebServices_介绍一文中, ...

  4. xcode下build release版本号的.a库

    1. 点击房子 图标button watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvcnlmZGl6dW8=/font/5a6L5L2T/fontsize/40 ...

  5. Android Studio 更新gradle插件

    今天更新了CentOS, 更新了java版本. 然后gradle跪了..... 不吐槽java版本的兼容性问题了.... 反正有他自己的理由.... 那么就更新gradle咯.... 下面是方法... ...

  6. Java类的实例化的初始化过程

    A a = new A(); new 创建对象过程: 1.类加载     代码验证 2.给对象在内存(堆)中分配空间(给属性赋值): 3.属性赋默认值: byte,short.int,long -&g ...

  7. Lucene 工作原理<转>

    Lucene是一个高性能的java全文检索工具包,它使用的是倒排文件索引结构.该结构及相应的生成算法如下: 0)设有两篇文章1和2 文章1的内容为:Tom lives in Guangzhou,I l ...

  8. 使用jsonp处理跨域问题

    调用web接口,get请求,发现提示:No 'Access-Control-Allow-Origin' header is present on the requested resource. 这个和 ...

  9. Entity Framework中的实体类添加复合主键

    使用Code First模式实现给实体类添加复合主键,代码如下: using System; using System.Collections.Generic; using System.Compon ...

  10. 第二百七十三节,Tornado框架-文件上传

    Tornado框架-文件上传 第一.普通表单上传文件 self.request.files["fafafa"] 获取上传文件信息,参数["上传文件框的name名称&quo ...