angular组件路由传值

这篇博客介绍了在Angular应用中如何使用`NavigationExtras`进行路由参数的传递,包括设置查询参数、跳过URL变化和指定片段。同时,讲解了如何通过`ActivatedRoute`订阅查询参数来接收传递的数据,将JSON字符串转换回对象。
摘要由CSDN通过智能技术生成

传值:

导入:

import { NavigationExtras, Router } from '@angular/router';

方法里

 const navigationExtras: NavigationExtras = {

      queryParams: {name: JSON.stringify(值)},

      skipLocationChange: true,  //不修改url,值不显示在url里

      fragment: 'anchor',

    };

    this.router.navigate(['/state'], navigationExtras);


接收

导入:

import {ActivatedRoute} from '@angular/router';

 this.activatedRoute.queryParams.subscribe((queryParams: any) => {

      this.customers = JSON.parse(queryParams.name)

    });


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值