在路线中更改参数

我正在开发一个项目，我需要两种GUI语言。我有LangService为每个组件提供短语。每个组件根据当前路线获取活动语言并从LangService请求短语。在路线中更改参数

我的问题是......我需要在我的导航栏内有“我的语言切换”，这是在主要的“app.component”中。 Navbar始终位于顶部，所以我可以从每个组件访问它。我希望能够点击导航栏中的按钮并更改当前路线（更改当前语言）。这怎么可能？我认为有一种方法可以改变route.params。那样我会改变route.params['lang'] = 'EN';

AppComponent.html：

<nav class="navbar navbar-default"> 
    <div class="container-fluid"> 
    <div class="navbar-header"> 
     <a class="navbar-brand" href="#">{{ title }}</a> 
    </div> 
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> 
     <ul class="nav navbar-nav navbar-right"> 
     <ol class="breadcrumb"> 
      <li *ngFor="let lang of langs"><a (click)="changeLanguage()">{{ lang }}</a></li> 
     </ol> 
     </ul> 
    </div> 
    </div> 
</nav> 
<router-outlet></router-outlet>

AppComponent.ts（我怎么觉得这是可行的）：

export class AppComponent { 
    changeLanguage() { 
    // catch the route params lang 
    // change route params 
    // set new route 
    } 
}

来源

2016-08-24 Dawid Zbiński

使用导航导航到相同的路线有不同的参数。因此，如果您位于/ component/subroute/en并切换到西班牙语，请使用router.navigate，其路径为/ component/subroute/es。

路由文档（https://angular.io/docs/ts/latest/guide/router.html#!#route-parameters）包含一个用于监听更改路由参数的示例，您将需要执行此操作，因为组件不会重新加载，因为实际路由不会更改，而只是参数。

来源

2016-08-24 09:08:42

在路线中更改参数

回答

相关问题