Angular 2路由器中的非Url参数

发布时间：2020-12-17 07:31:51 所属栏目：安全来源：网络整理

导读：在角度1. *中,我使用ui-router并且能够将NON URL参数从一个状态传递到另一个状态.通过NON URL参数,我的意思是传递一些不出现在URL上的参数(这对用户来说是完全透明的). 在Angular 1. *中执行此操作的方法是通过定义这样的状态(stateToRedirect是非url参数) $

在角度1. *中,我使用ui-router并且能够将NON URL参数从一个状态传递到另一个状态.通过NON URL参数,我的意思是传递一些不出现在URL上的参数(这对用户来说是完全透明的).

在Angular 1. *中执行此操作的方法是通过定义这样的状态(stateToRedirect是非url参数)

$stateProvider
    .state('LOGIN_STATE',{
      url: `login`,component: 'login',params: {
        stateToRedirect: 'home'
      }
    });

并改变这样的状态：

$state.go('LOGIN_STATE',{
    stateToRedirect: 'OTHER_STATE',});

在LOGIN_STATE中,我能够访问此参数：

$stateParams.stateToRedirect;

我正在尝试为Angular 2路由器找到相同的行为,我的理解是Angular 2路由器已经改进了很多,我们可能不需要使用ui-router-ng2.

所以我的问题是：你如何在Angular 2路由器中重现上述行为？

This question似乎是我想要的,但我不想在URL中使用参数,并且路径上的’data’属性看起来不错,但我找不到关于如何动态设置它的文档.

你问的问题更多是关于 component to component communication而不是路由本身.您需要的是将数据从一个组件(与特定路由相关联)传递到另一个组件(与另一个路由相关联).

可以通过以下方式实现组件到组件的通信

>具有父子关系的组件可以通过@Input()和@Output()装饰器和事件发射器传递数据
> Via the use of a service.不共享驻留在同一模块中的父子关系的组件可以通过服务共享数据,或者通过使用Observable序列(具有生产者 – 消费者模型),或者通过在变量中设置数据并相应地读取.通过向根(或两者为父)模块注册服务,可以将此方法扩展到驻留在不同模块中的组件.
>通过路由器.数据可以通过路由器作为路径参数传递,例如：my / path / thisisapathvalue,optional parameters(使用矩阵表示法),例如my / path; item = hello; item2 = world或通过查询字符串参数,例如my / path？item = hello& ; ITEM2 =世界.您还可以使用resolve guards解析特定组件的数据,该解析可以解析静态数据,从服务器检索的数据,通过函数解析等.

对于您的场景,您最需要的是一个服务,它将源组件与目标组件之间的数据进行通信,因为即使使用解析保护来解析数据,您也需要一个额外的服务来临时存储数据.你需要通过.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!