路由angular2时的可选参数 [英] Optional Parameters While Routing angular2

查看:271
本文介绍了路由angular2时的可选参数的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

如何在angular2.my路由配置中定义可选参数,如下所示:

How to define optional parameters in routing of angular2.my routing configuration like this:

<a [routerLink]="['../abc',{xyz: blabla}]">
     and 
<a [routerLink]="['../abc']">

{ path: '/abc/:xyz', component: abc, name: 'abc' },  // Here i want xyz as optional perameter

所以问题是,每当我使用带有参数 blabla 的第一种方法时,它都可以正常工作,因为在路由时,我已经定义了参数 xyz
,但是在第二种方法中,我不想发送参数,因此URL变为

so the problem is whenever i am using first method with parameter blabla it works fine because at the time of routing i have defined parameter xyz but in case of second method i dont want to send parameter so the URL becomes

http:// localhost:8080 /#/ sideNav / abc /

这是第一次很好,但是刷新页面后没有任何显示整个窗口变得空白,没有内容。
所以有什么方法可以在angular2中路由时提供可选参数。

which is laoding first time fine but after refresh page nothing shows whole window is getting blank with no contents. so is there any method to provide optional parameters while routing in angular2.

i have also tried without defining parameters like this

{ path: '/abc', component: abc, name: 'abc' }

,但是如果xyz的值为 1 会抛出错误,它将 1 转换为 true

but this will throw error in case of value of xyz is 1 it converts 1 into true

推荐答案

您可以定义带有或不带有相同参数的多个路由组件:

You can define multiple routes with and without parameter having the same component:

@RouteConfig([{
  path: '/abc',
  component: Abc,
  name: 'abc'},
{
  path: '/abc/:xyz',
  component: Abc,
  name: 'abcXyz'
}])

然后使用您需要的那个


<a [routerLink]="['/abcXyz',{xyz: blabla}]">
     and 
<a [routerLink]="['/abc']">


如果 routeCongig 位于您的根文件中,在根名前使用 / ,如果它在第二级或其他名称上,请使用

If routeCongig is located in your root file, use / before root's name and if it's on the second level or something, use

<a [routerLink]="['/parentRoot', {parentParams:value}, '/abc']">

这篇关于路由angular2时的可选参数的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

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