如何在不在url中的状态之间传递参数? [英] How to pass parameter between states not in a url?

查看:90
本文介绍了如何在不在url中的状态之间传递参数?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想知道如何传递URL中不可见的参数?

I am wondering how can I pass parameters, that won't be visible in URL?

到目前为止,我有:

{path: '/editUser/:userId', name: 'Edit User', component: UserEditComponent}

当我像这样导航到该视图时:

And when I navigate to this view like that:

<a href="#" [routerLink]="['Edit User',{userId: id}]"

userId将显示在URL中.

如何设置它,使其在URL中不可见?

How can I set it, so that it is not visible in the URL?

谢谢

推荐答案

好问题!

我不知道该怎么做,但是是的,我也知道如何做,所以张贴答案可能会帮助某人.

I don't know exactly how to do that but yes I know alternate of same so posting as answer may to help someone.

基本上,据我所知,有两种选择可以通过路由发送数据

Basically There are two options (up to my knowledge) to send data via routing

  • RouteParams(有问题)
  • 数据(路由时的属性)

现在,当我们使用RouteParams发送数据时,我们必须以更类似的方式进行定义,如下所示:

Now when we send data using RouteParams we have to define in the similer way like this:

{path: '/editUser/:userId', name: 'Edit User', component: UserEditComponent}

<a href="#" [routerLink]="['Edit User',{userId: id}]"

通过这种方法,我们可以正常发送数据,但所有数据在URL中都是可见的

By using this method we send data normaly but all data is visible in the URL

当我们不想在URL路径中显示数据时,我们必须使用angualr2提供的@RouteConfig annotationdata属性通过路由发送数据.通过使用此属性,我们可以在路由配置时将其他数据发送到组件,而无需在URL中显示.这是此属性的示例.

when we don't want to show data in the URL path than we have to send data via routing using data property of the @RouteConfig annotation provided by angualr2. by using this property we can send additional data to the components at the time of the route configuration without showing it in the URL. here is example of this property.

@RouteConfig([
    {path: '/product/:id', component: ProductDetailComponentParam,
     as: 'ProductDetail', data: {isProd: true}}])

export class ProductDetailComponentParam {
    productID: string;
    constructor(params: RouteParams, data: RouteData) {
        this.productID = params.get('id');
 
        console.log('Is this prod environment', data.get('isProd'));
    }
}

通过使用此选项,我们可以通过路由发送数据而无需在URL中显示. 相同的工作示例: http://plnkr.co/edit/N5IzUH0pc3nN1O7iQZkD?p=preview]

by using this we can send data via routing without showing in the URL. working example of same: http://plnkr.co/edit/N5IzUH0pc3nN1O7iQZkD?p=preview]

有关更多信息,请阅读此很棒的文章

for more info read out this awesome article

这篇关于如何在不在url中的状态之间传递参数?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆