javascript 带参数的Angular 14默认路由器

2cmtqfgy  于 2023-01-16  发布在  Java
关注(0)|答案(2)|浏览(99)

我用上一个版本创建了一个Angular 应用程序,我将基本href更新为/popup,使url为http://localhost:4200/popup
我想,当应用程序在url http://localhost:4200/popup中打开时,它会将我重定向到404页面,但当我在url http://localhost:4200/popup/444444444中添加参数时,它会打开特定页面。
我尝试了下面的代码,但我有这个错误:
main.ts:13错误:NG 04014:路由“/:requestNumber”的配置无效:路径不能以斜杠开头

<base href="/popup" />

export const routes: Routes = [
  { path: '', redirectTo: '/:requestNumber', pathMatch: 'full' },
  {
    path: '/:requestNumber',
    component: AppComponent,
    resolve: { payment: PaymentResolverService },
  },
];

我添加了解析器来检查URL是否有参数requestNumber。

ws51t4hk

ws51t4hk1#

这个问题并不清楚,如果我没理解错的话--你不能期望一个路径为/popup/444444的路由会被一个空路径捕获(因为它不是一个空路径,因为它包含了44444),因此,你不能这样写:

{ path: '', redirectTo: '/:requestNumber', pathMatch: 'full' }

上面的路径配置选择了空路径,即/popup/,当您希望它重定向到/popup/:requestNumber时,它将从哪里获得请求编号?(请记住,到达此处的路径是/popup/
你可以写这样的,空的路径被重定向到一个404页面:

export const routes: Routes = [
    {
        path: '',
        component: Some404Page,
    },
    {
        path: ':requestNumber',
        redirectTo: 'popup/:requestNumber',
        pathMatch: 'full',
    },
    {
        path: 'popup/:requestNumber',
        component: AppComponent,
        resolve: { payment: PaymentResolverService },
    },
];
mzillmmw

mzillmmw2#

由于这是谷歌上唯一的点击率,我只想补充一个侧面的答案。
我得到这个错误显然这条路线:

{
    path: 'stuff/moduleA',
    loadChildren: () => import('./modules/module-a/module-a.module').then(m => m.module-a)
},

这是没有意义的,因为这里显然没有前导斜杠,问题实际上是这个延迟加载的模块包含了一个如下所示的路由:

{
    path: '/',
    component: AComponent,
},

修复方法是将 * 此 * path更改为path: ''
因此,检查加载模块内部的路由,即使错误中没有提到该路由。

相关问题