如何在 Angular 2 路由中动态更改基本 URL？答案

【问题标题】：How do I change the base URL dynamically in Angular 2 routing?如何在 Angular 2 路由中动态更改基本 URL？
【发布时间】：2017-05-28 16:50:39
【问题描述】：

目前，我在我的项目中设置了路由。每个新用户都被重定向到：

localhost:4200/默认路径/登录

一旦用户登录，他们就会被重定向到主模块，该模块有一些用户可以导航到的子路由。

localhost:4200/default-path/home
localhost:4200/default-path/home/account
localhost:4200/default-path/home/account/profile
localhost:4200/default-path/home/dashboard

...等等。

现在，粗体部分已经设置在 home 模块中，不需要进一步编辑。但是，我想将default-path 更改为其他内容。

比如说，每个用户都可以属于三个项目之一：蓝色项目、红色项目或绿色项目。此信息仅在用户提交凭据并点击登录按钮后可用。

登录后我希望路由说的是：

localhost:4200/project-blue/home
localhost:4200/project-red/home
localhost:4200/project-green/home

请记住，粗体部分不是具有不同关联组件的不同模块，它们只是我希望在 URL 中看到的常量。

目前，我在索引中的<base> 标记类似于<base href='/'>，我正在尝试编辑此属性。我得到的是这样的：

processLoginSuccess(loginTicket): void {
    const routeName = loginTicket.baseUrl // returns 'project-red'
    let b = document.getElementsByTagName('base')[0]
    b.setAttribute('href', routeName )

    this._router.navigate(['/home']);
}

但这似乎不起作用。

有什么想法吗？

【问题讨论】：

stackoverflow.com/questions/37756167/…
@GünterZöchbauer：看起来它重置了子路由的配置。我需要编辑我的基本网址。我可以用 resetConfig 做到这一点吗？
不，我认为没有办法修改基本网址
我认为可以在路由配置中为项目路由的子路由设置动态路由链接。
类似const projectsRoutes: Routes = [ { path: '', component: ProjectsComponent, children: [ { path: ':projectName/home', component: ProjectHomeComponent } ] } ];

标签： html angular angular2-routing

【解决方案1】：

除了设置base 元素的href 值，您还可以通过自定义操作提供APP_BASE_HREF，以编程方式设置基本URL。

这里已经讨论过了：https://stackoverflow.com/a/41674411/415790

【讨论】：