有没有办法在编译时管理角度路线？

Question

对于像我这样的 Ng 高级初学者，调试角度路由是在运行时完成的。我正在寻找一种解决方案，以便在编译时对一致性有更高的信心。

情况

管理 Ng 路线意味着管理一个包含 3 个部分的对象

• 路径
• 组件
• 出口

对于每条路线，根据要更改的部分，都有维护点来一致地管理这 3 个部分。

1. 在设置路由的 typescript app-routing.module.ts 中

 ...
  // foo routes
  { path: 'book-adder', component: BookAdderComponent, outlet: 'foo' },
  { path: 'book-detail/:id', component: BookDetailComponent, outlet: 'foo' },

  { path: 'editor-adder', component: EditorAdderComponent , outlet: 'foo'},
  { path: 'editor-detail/:id', component: EditorDetailComponent, outlet: 'foo' },
...

1. 在声明路由器出口的 html 模板中

...
<router-outlet name="foo"></router-outlet>
...

1. 在控制器中导航的调用中

...
  setDetailOutlet(id: number) {
    this.router.navigate([{
      outlets: {
        foo: ["book-detail", id]
      }
    }]);
  }
...

问题

• 要重命名路由器出口部分（例如从“foo”改为“bar”），必须手动更改三个维护点的代码。
• 要重命名路径，必须在两个维护点手动更改代码。
• 要管理组件部分，必须手动更改 app-routing.module.ts 和调用组件中的代码

问题

• 是否有解决方案集中解决方案，以最大限度地减少每条路线的维护点？

Answer 1

最好的方法是使用Auth guards from angular。

但要回答您的问题，请尝试

<!-- Since you cannot bind [name] property and throw you error --> <router-outlet name="{{outletName}}"></router-outlet>

使用您从中调用代码的组件中的 outletName。