Angular 2路由器路径 [英] Angular 2 router paths

问题描述

我有2个关于Angular 2路由器路径的问题，我花了一些时间在上面搜索，但是没有运气，反正我有以下路由设置:

i have 2 questions regarding Angular 2 router paths, i've spent some time googling about it, but with no luck, anyways i have following routes setup:

{ path: 'contract', component: ContractInsertUpdateComponent, children: [
         { path: '' },
         { path: ':id', component: ContractInsertUpdateComponent, children:[
                  { path: 'buyers', component : ContractTabBuyerComponent },
                  { path: 'seller', component : ContractTabSellerComponent }
        ]}                
]}

首先，让我在这里解释我要实现的目标，我想对合同的插入/更新使用相同的组件.我还有更多的子级路由，完整的网址应类似于

First of all, let me explain what i'm trying to achieve here, i want to use same component for both insert/update of contract. I also have more children routes and complete url should look something like

localhost:4200/contract/2/buyers

localhost:4200/contract/2/buyers

1. 我很好奇的第一件事是默认的合同途径

1. First thing i'm curious of is default route of contract

{路径:"}

如果我理解正确的话，路线是

If i understand it right if route is something like

localhost:4200/contract

localhost:4200/contract

它应该加载它在atm上执行的ContractInsertUpdateComponent，我的问题是:这是正确的方法吗?另外，如果可能，我还要避免将空组件用作默认路由.

it should load ContractInsertUpdateComponent, which it does atm, my question is: Is this the right way to do it? Also I would like to avoid usage of empty component as default route if possible.

1. 此路由设置的其余部分当前不起作用，例如，如果我输入类似
的内容

localhost:4200/contract/2

localhost:4200/contract/2

我得到错误:无法匹配任何路线.网址段:"contract/2"

im getting Error: Cannot match any routes. URL Segment: 'contract/2'

以我的理解，它应该加载ContractInsertUpdateComonent我错了吗?

In my understanding it should load ContractInsertUpdateComonent am i wrong?

我不知道在哪里可以寻求帮助，我需要一些人来指引我正确的方向……谢谢您的帮助！

I don't know where else to look for help, and I need some one to point me to the right direction...Thanks for help in advance!

推荐答案

`/contract/2匹配此路线

`/contract/2 matches this route

{ path: '' },

因为/contract/2以''开头(实际上每条路线都这样做) 然后搜索该路由的子路由，但由于没有子路由而失败.

because /contract/2 starts with '' (actually every route does) and then searches for child routes of this route but fails because there are none.

{ path: '', pathMatch: 'full' },

应该修复它，因为路由器不会搜索以''开头的路由，而只会搜索是 ''

should fix it, because then the router doesn't search for routes that start with '' but only for routes that are ''

更新

{ path: 'contract', component: ContractInsertUpdateComponent, children: [ 
    { path: '', pathMatch:'full', /* I guess you want some `component: ...` or `redirectTo: ...` here }, 
    { path: ':id', children:[ 
        { path: '', pathMatch:'full' }, 
        { path: 'seller', component : ContractTabSellerComponent } 
    ]} 
 ]}

这篇关于Angular 2路由器路径的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！