Angular 2 (v6) 中的路由

Question

我在 Angular 2 (v6) 中遇到了一些路由问题

网站的结构如下：

（根，site.com/）

----subfolder1 (site.com/subfolder1)

----subfolder2 (site.com/subfolder2)

----client(site.com/client)

当我们部署时，我们使用：ng build --prod --deploy-url=/client/

出于某种原因，当我们导航到 site.com/client/quote/88b02e09-511b-40c5-a64a-a3aeb2b9d239 时，它总是会转到 PageNotFoundComponent

我们的路线参数：

const 路由：Routes = [ { path: '', component: QuoteSearchComponent }, { 路径：'quote/:guid'，组件：QuoteComponent }，{ 路径： '**', 组件: PageNotFoundComponent } ];

main.9a26b5fe0012f4ac3aae.js:1 GuardsCheckEnd(id: 1, url: '/quote/88b02e09-511b-40c5-a64a-a3aeb2b9d239', urlAfterRedirects: '/quote/88b02e09-511b-40c5-a64a-a3aeb2b9d239', state: Route(url:'', 路径：''）{ 路线（网址：'quote/88b02e09-511b-40c5-a64a-a3aeb2b9d239'， 路径：'quote/:guid') } , shouldActivate: true) main.9a26b5fe0012f4ac3aae.js:1 e {id: 1, url: “/quote/88b02e09-511b-40c5-a64a-a3aeb2b9d239”，urlAfterRedirects： “/quote/88b02e09-511b-40c5-a64a-a3aeb2b9d239”，状态：e， shouldActivate: true} main.9a26b5fe0012f4ac3aae.js:1 路由器事件：e main.9a26b5fe0012f4ac3aae.js:1 ResolveStart(id: 1, url: '/quote/88b02e09-511b-40c5-a64a-a3aeb2b9d239', urlAfterRedirects: '/quote/88b02e09-511b-40c5-a64a-a3aeb2b9d239', state: Route(url:'', 路径：''）{ 路线（网址：'quote/88b02e09-511b-40c5-a64a-a3aeb2b9d239'， 路径：'quote/:guid') } ) main.9a26b5fe0012f4ac3aae.js:1 e {id: 1, url: “/quote/88b02e09-511b-40c5-a64a-a3aeb2b9d239”，urlAfterRedirects： “/quote/88b02e09-511b-40c5-a64a-a3aeb2b9d239”，状态：e} main.9a26b5fe0012f4ac3aae.js:1 路由器事件：e main.9a26b5fe0012f4ac3aae.js:1 ResolveEnd(id: 1, url: '/quote/88b02e09-511b-40c5-a64a-a3aeb2b9d239', urlAfterRedirects: '/quote/88b02e09-511b-40c5-a64a-a3aeb2b9d239', state: Route(url:'', 路径：''）{ 路线（网址：'quote/88b02e09-511b-40c5-a64a-a3aeb2b9d239'， 路径：'quote/:guid') } ) main.9a26b5fe0012f4ac3aae.js:1 e {id: 1, url: “/quote/88b02e09-511b-40c5-a64a-a3aeb2b9d239”，urlAfterRedirects： “/quote/88b02e09-511b-40c5-a64a-a3aeb2b9d239”，状态：e} main.9a26b5fe0012f4ac3aae.js:1 路由器事件：t main.9a26b5fe0012f4ac3aae.js:1 ActivationEnd（路径：'quote/:guid'） main.9a26b5fe0012f4ac3aae.js:1 t {快照：t} main.9a26b5fe0012f4ac3aae.js:1 路由器事件：t main.9a26b5fe0012f4ac3aae.js:1 ChildActivationEnd（路径：''） main.9a26b5fe0012f4ac3aae.js:1 t {快照：t} main.9a26b5fe0012f4ac3aae.js:1 路由器事件：e main.9a26b5fe0012f4ac3aae.js:1 NavigationEnd(id: 1, url: '/quote/88b02e09-511b-40c5-a64a-a3aeb2b9d239', urlAfterRedirects: '/quote/88b02e09-511b-40c5-a64a-a3aeb2b9d239') main.9a26b5fe0012f4ac3aae.js:1 e {id: 1, url: “/quote/88b02e09-511b-40c5-a64a-a3aeb2b9d239”，urlAfterRedirects： "/quote/88b02e09-511b-40c5-a64a-a3aeb2b9d239"}

Answer 1

我需要更多关于你想要做什么的信息，但请查看我的示例作为指导：

最佳实践表明您始终需要在语句中放置路径值。

import { RouterModule, Routes } from '@angular/router'
import { HomeComponent } from './components/home/home.component';
import { AboutComponent  } from './components/about/about.component'
import { HeroesComponent } from './components/heroes/heroes.component'

const APP_ROUTES: Routes = [
    { path: 'home', component: HomeComponent},
    { path: 'about', component: AboutComponent},
    { path: 'heroes', component: HeroesComponent},
    { path: '**', pathMatch: 'full', redirectTo: 'home'}
]

export const APP_ROUTING = RouterModule.forRoot(APP_ROUTES, { useHash: true });