带参数的根路径上的角度路由

Question

我正在尝试将我的角度路线上的路径配置为在空根路径上有一个 ID 参数。例如localhost:4200/123 我当前的工作代码就像localhost:4200/view/123

这是我目前的工作路线

const routes: Routes = [
  {path: '', redirectTo: 'main', pathMatch: 'full'},
  {path: 'main', component: MainComponent},
  {path: 'view/:id', component: ViewComponent},
];

理想情况下，我想废弃路径的 /view/ 部分。

我试过了

const routes: Routes = [
  {path: '', redirectTo: 'main', pathMatch: 'full'},
  {path: '/:id', component: ViewComponent},
  {path: 'main', component: MainComponent},
];

与删除正斜杠的组合。

我也试过了

const routes: Routes = [
  {path: '', redirectTo: 'main', pathMatch: 'full'},
  {path: '/:id', redirectTo: 'view', pathMatch: 'full'},
  {path: 'main', component: MainComponent},
  {path: 'view', component: ViewComponent},
];

结合删除正斜杠并将/:id 添加到{path: 'view', component: ViewComponent},

当我尝试以前不工作的路线时，页面显示为空白并且控制台中没有错误。

使用 Angular 5.2.0

Answer 1

应该是这样的。

const routes: Routes = [
    { path: ':id', component: HomeComponent },
    ......
];