6

我正在使用 angular2 构建一个单页应用程序，它需要根据应用程序的路由呈现不同的应用程序模板。在最高级别，它应该能够在主应用程序模板和应用程序的管理模板之间切换。

路由规则：

  • 如果 url 路径以 /auth 开头，则它由 AuthApp 处理
  • 如果它以其他任何内容开头，则应由 MainApp 处理

执行：

为了实现这一点，我有一个最高级别的组件应用程序，它将责任委托给 AuthApp 或 MainApp，就像这样。

@RouteConfig([
  {
    path: '/auth/...',
    component: AuthApp,
    as: 'Auth'
  },
  {
    path: '/...',
    component: MainApp,
    as: 'Main'
  }
])

然后每个子应用程序（例如 AuthApp、MainApp）都有自己的路由定义，例如这样。

@RouteConfig([
  { path: '/current-vacancies', CurrentVacancies, as: 'CurrentVacancies', useAsDefault: true },
  { path: '/candidates/create', CandidateCreate, as: 'CandidateCreate'},
  ...
])

从功能上和从设计的角度来看，这很好用！

问题：

在主应用程序中，应用程序的路由配置未指定路径（例如/...=> MainApp），我不想要嵌套的 url 路径。例如，如果您通过应用程序 (routerLink) 导航到 CurrentVacancys，它会更新 url 并在前面添加一个多余的正斜杠。.../#//current-vacancies当我希望它读取 url 路径时，它现在看起来像这样.../#/current-vacancies。

当您.../#/current-vacancies在地址栏中键入时，应用程序路由实际起作用，它会正确转换。然而，通过应用程序 routerLink 指令导航会添加不需要的正斜杠。

我从逻辑上理解为什么会发生这种情况，委托给 MainApp 的根组件的路径为“/”，并且它与它的子组件连接在一起形成一个完整的 url 路径。但在这种情况下，不希望有额外的斜线。任何想法如何删除它，或以某种方式覆盖此行为。

顺便说一句，我已经考虑将 MainApp 组件路由移动到最顶层，虽然这确实解决了我报告的 url 路径问题，但它不允许我在顶层切换模板。

总之

请帮助我，要么

  • 如何删除/主应用程序路线上不需要的"preferred option"，或
  • 如何设计应用程序以具有可切换的顶级模板和嵌套组件路由。

谢谢

4

1 回答 1

2

这在今天有效（Angular 4）并且似乎在 Angular 2 final 发布之前已经修复。

于 2017-07-26T09:42:06.420 回答