首页 > 解决方案 > 角度参数仅适用于子文件夹,不适用于根级别

问题描述

我在使用参数时遇到问题 - 它们仅适用于子文件夹。

当我在 localhost:1234 上测试我的代码时,ID 不起作用。在服务器上运行它时,它在一个子文件夹中工作,这意味着这将工作: www.somewhere.com/development/signin/1234 但这将不起作用 www.somewhere.com/signin/1234

我的系统中有两个,它们的行为相同。当从代码中打开时,它可以工作,但是将其作为电子邮件上的链接或只是手动输入地址,它将不起作用。只有在使用 /development 等子文件夹时,它才会起作用。

这很容易复制 - 在任何系统中,转到打开带有 ID 的项目的位置 - 例如 viewitem/1234 - 打开后按 ctrl+f5。在我的情况下,角度停止工作并且页面变为空白

为什么是这样?

孔文件是:

export const appRoutes: Routes = [
  {
    path: 'signin/:id',
    component: SigninComponent,
    data: {
      title: 'Login',
      subtitle: ''
    }
  },
  {
    path: 'signin',
    component: SigninComponent,
    data: {
      title: 'Login',
      subtitle: ''
    }
  },
  {
    path: 'main',
    component: MainPageComponent,
    canActivate: [SigninGuard],
    data: {
      title: 'Main page',
      subtitle: ''
    }
  },  
  {
    path: 'item/:id',
    canActivate: [SigninGuard],
    component: DetailsComponent,
    data: {
      title: 'ItemDetails',
    }
  },
  {
    path: 'report',
    component: ReportComponent,
    canActivate: [SigninGuard],
    data: {
      title: 'Status Report',
    }
  },
  {
    path: '',
    redirectTo: '/main',
    pathMatch: 'full'
  },
  {
    path: '**',
    component: NotFoundComponent,
    data: { title: '404' }
  }
];

@NgModule({
  imports: [
    RouterModule.forRoot(appRoutes, {initialNavigation: true})
  ],
  exports: [RouterModule]
})

export class AppRoutingModule { }

标签: angular

解决方案


推荐阅读