Angular 重定向到具有动态参数的路径的路由器错误

Question

我想在用户访问 root (localhost:4200) 时将用户重定向到具有唯一 UUID 的路径。

但是我得到这个错误

ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'document/4fdb309b-df59-4da8-a32d-5265f7925bba'

Error: Cannot match any routes. URL Segment: 'document/4fdb309b-df59-4da8-a32d-5265f7925bba'

下面是我的路由器模块代码段

import { v4 as uuidv4} from 'uuid'

const routes : Routes = [
  {path : '', redirectTo : '/document/'+uuidv4(), pathMatch: 'full'},
  {path : 'documents/:id', component: DocumentComponent}
]

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule {
}

不知道怎么了！

Answer 1

您不能声明动态路由路径。 uuid4() 每次都会生成不同的 uuid，而且您没有那么多组件映射到路由。您可能还希望 uuid 作为路由参数。将第一条路线更改为以下路线，看看是否有帮助。

{path : '', redirectTo : '/document/someComponent', pathMatch: 'full'},

Answer 2

很可能是因为路线排序。尝试重新排列路线

const routes : Routes = [
  {path : 'documents/:id', component: DocumentComponent},
  {path : '', redirectTo : '/document/'+uuidv4(), pathMatch: 'full'}
]

请注意 Angular 路由器使用 first-match wins strategy 并且数组中路由的顺序很重要。

Angular 重定向到具有动态参数的路径的路由器错误

Angular Router error redirecting to path with dynamic parameter

javascript

angular-routing

angular