ionic4的路由传参和modal传参

最新推荐文章于 2022-07-12 00:05:37 发布

kikyou`

最新推荐文章于 2022-07-12 00:05:37 发布

阅读量2.3k

点赞数 1

分类专栏： ionic4 前端记录文章标签： ionic4

本文链接：https://blog.csdn.net/kikyou_csdn/article/details/89361017

版权

本文详细介绍了在Ionic4中如何进行路由传参和使用Modal进行参数传递。对于路由传参，包括普通参数和复杂参数的传递方式，并强调了NavParams在ionic4中的变化。在Modal传参部分，展示了如何在页面间传递和接收值，以及modal关闭时回传值的技巧。

摘要由CSDN通过智能技术生成

一、路由传参

1.普通参数

例：perfect-self页面跳转到gongsi-organization页面传递参数store_id和store_name
perfect-self.page.ts

import {
    Router } from '@angular/router';
...
constructor(
	public router: Router,
){
   }
...
this.router.navigate(['gongsi-organization'], {
   
              queryParams: {
   
                store_id: this.storeinfo.store_id,
                store_name: this.storeinfo.store_name,
              }
            });

gongsi-organization.page.ts

import {
    ActivatedRoute, Params } from '@angular/router';
...
constructor(
    public activated: ActivatedRoute,
  ) {
    
    this.activated.queryParams.subscribe((params: Params)=>{
   
      this.store_id <