Warm tip: This article is reproduced from serverfault.com, please click

其他-将可变前缀添加到 Angular 路由

(其他 - Add variable prefix to angular routing)

发布于 2017-11-16 14:08:31

我正在尝试将旧的BackBone.js应用程序更新为Angular(4/5)。要求之一是在此新应用中继续使用旧路线,这会引发一些挑战。

旧路线的构建如下:

site.com/r/{username}/{route}

例如

site.com/r/johndoe/homepage
site.com/r/janedoe/blog

我现在正在使用没有哈希的Angular路由,但是我在Angular中构建的每个路由现在都包含一个长字符串:

{ path: '/r/:username/homepage' }

我希望这里有一种更清洁的使用路线的方法。:username变量仅在引导应用程序时才需要,因此从Url中剥离掉第一位并在此之后启动NG路由路径会更好。

我知道base href会将应用程序编译到潜在的子目录,但这不适用于变量username。

有没有办法在Angular中完成这项工作?

Questioner
Jordy Bulten
Viewed
11
pioro90 2017-11-16 22:23:27

你可以执行以下操作:

const appRoutes: Routes = [
 {
   path: 'r',
   component: AppComponent,
   children: [
      { path: ':username/homepage', component: HomePageComponent },
      // other children or you can use loadChildren
   ]
 }
];

https://angular.io/guide/router#lazy-loading-route-configuration