Angular 5中的参数化路由

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

导读：基于 LINK从这里 – 在我的应用程序中我已经路由： const routes: Routes = [ { path: 'blog/:id',component: BlogComponent },{ path: 'blog/moo',component: MooComponent },]; 并且有以下信息： If we visited /blog/moo we would show MooComponent even

基于 LINK从这里 –
在我的应用程序中我已经路由：

const routes: Routes = [
 { path: 'blog/:id',component: BlogComponent },{ path: 'blog/moo',component: MooComponent },];

并且有以下信息：

If we visited /blog/moo we would show MooComponent even though it
matches the path for the first blog/:id route as well.

Important Non-parameterised routes take precedence over parameterised
routes.

不幸的是,它并不像那样.如果我将转到url blog / moo,那么路由会将moo视为Id并将打开BlogComponent.

我想知道如何解决我有两个想法：

>我可以改变路径.博客/身份证和博客/ moo.
>我可以使用UrlMatcher但是当我更改previos url段时可能会有些问题.所以这个功能应该做好充分准备.

你怎么看？有任何想法吗？

解决方法

根据Angular官方文档 refer to this

路由器选择具有第一个匹配获胜策略的路由.

The router selects the route with a first match wins strategy.
Wildcard routes are the least specific routes in the route
configuration. Be sure it is the last route in the configuration.

The order of the routes in the configuration matters and this is by
design. The router uses a first-match wins strategy when matching
routes,so more specific routes should be placed above less specific
routes. In the configuration above,routes with a static path are
listed first,followed by an empty path route,that matches the
default route. The wildcard route comes last because it matches every
URL and should be selected only if no other routes are matched first.

Even this explains the same regarding the route prioritization

所以你应该按照相反的顺序保持你的路线：

const routes: Routes = [
 { path: 'blog/moo',{ path: 'blog/:id',];

我想强调上述陈述中的一点：

注意：

更具体的路线应放在不太具体的路线上方.

由于’blog / moo’更具体,您需要将其放在’blog /：id’上方

I have created a PLUNKER for your example

（编辑：李大同）

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