在 Angular 6 中隐藏 url 地址栏上的默认语言

Question

我是新手，我在 Angular 6 中遇到路由器问题。我会三种语言：en、de、fr。所以现在，我在地址栏上的 url 是：

localhost:4200/en/home
localhost:4200/de/home
localhost:4200/fr/home

但我想要 En（默认语言），我的 url 应该是这样的：

localhost:4200/home

剩下的是：

localhost:4200/de/home
localhost:4200/fr/home

这是我的配置路线：

 const routes: Routes = [
     {
        path: ':lang/home',
        component: LandingPageComponent,
        children: LandingPagePageRoutes
     },
     {
        path: ':lang/product',
        component: ProductSinglePageComponent,
        children: ProductPageRoutes
     },
     {
        path: '',
        redirectTo: `/${LANG}/home`,
        pathMatch: 'full'
     },
     {
        path: '**',
        redirectTo: `/${LANG}/home`,
     }
 ];

我们能做到吗？如果是，请给我一些例子吗？非常感谢！

Answer 1

因为 Angular 不允许来自另一个重定向的重定向，我认为你可以这样做的一种方法是，在你的根组件的构造函数中，这可能是 app.component.ts，你可以得到应用程序启动时页面的 url，如果是 localhost:4200/en/home，则重定向到 localhost:4200/home。您的代码将如下所示。

app.component.ts

import { Router } from '@angular/router';

constructor(private router: Router) {
  if(this.router.url === "/en/home"){
        router.navigateByUrl('/home')
    }
 }

然后在你的路由模块中，你应该有一个 url 匹配 /home

类似这样。

 {
    path: 'home',
    component: EnglishLandingPageComponent
 }

在 Angular 6 中隐藏 url 地址栏上的默认语言

Hide language default on url address bar in Angular 6

router

angular

angular6