在Angular1.*中,我使用的是UI路由器,能够将非URL参数从一个状态传递到另一个状态。我所说的非url参数是指传递一些url上没有的参数(对用户来说是完全透明的)。
在Angular1.*中执行此操作的方法是定义这样的状态(stateToreDirect是非URL参数)
$stateProvider
.state('LOGIN_STATE', {
url: `login`,
component: 'login',
params: {
stateToRedirect: 'home'
}
});
像这样改变状态:
$state.go('LOGIN_STATE', {
stateToRedirect: 'OTHER_STATE',
});
在登录状态下,我可以通过以下操作访问此参数:
$stateParams.stateToRedirect;
我正试图找到同样的行为,为角2路由器,我的理解是,角2路由器已经改善了很多,我们可能不需要使用ui-router-ng2。
所以我的问题是:如何在Angular2路由器中再现上述行为?
This question似乎是我想要的,但我不希望url中有parameter,而且路由上的“data”属性看起来不错,但我找不到关于如何动态设置它的文档。
最佳答案
你问的问题更多的是关于component to component communication而不是路由本身。您需要的是将数据从一个组件(与特定路由关联)传递到另一个组件(与另一个路由关联)。
组件间通信可以通过以下方式实现
具有父子关系的组件可以通过@input()和@output()装饰器和事件发射器传递数据
Via the use of a service不共享位于同一模块中的父子关系的组件可以通过服务共享数据,或者通过使用可观察序列(具有生产者-消费者模型),或者通过在变量中设置数据并相应地读取。通过向根(或父)模块注册服务,可以将此方法扩展到位于不同模块中的组件。
通过路由器。数据可以作为路径参数通过路由器传递,例如:my/path/thisisapathvalue
,optional parameters(使用矩阵表示法),例如my/path;item=hello;item2=world
或通过查询字符串参数例如my/path?item=hello&item2=world
。您还可以使用resolve guards解析特定组件的数据,它可以解析静态数据、从服务器检索的数据、通过函数解析的数据等。
对于您的场景,您最可能需要的是在源组件和目标组件之间通信数据的服务,因为即使使用resolve guards来解析数据,您也需要额外的服务来临时存储您需要传递的数据。
关于angular - Angular 2路由器中的非URL参数,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/45505399/