在'路由器模块中传递查询参数'路由数组和读入组件

时间:2017-10-25 08:56:32

标签: angular routing angular2-routing

我试图区分样本公司和其他公司。所以我通过查询参数来检查它是否是样本公司并检查查询参数样本是否在Route数组中是真的

const routes: Routes = [{ path: '',
    component: DefaultComponent,
    children: [
        {path: 'company', redirectTo: 'company-data/1?sample=true'},
        {path:'company/:id', component: CompanyComponent}
]}];

如何在组件中读取此查询参数并获取示例公司的真实值以及其他示例为false的公司。如果我尝试像这样获取它,我会得到未定义的

this.route.queryParams.subscribe(params => {
    console.log('Query params ',params['sample']) 
});

我不知道这是否正确。

2 个答案:

答案 0 :(得分:1)

queryParams是可选参数。您无需在Routes模块中指定它们。但为此,您需要确保不仅传递id = 1

const routes: Routes = [{ path: '',
component: DefaultComponent,
children: [

    {path:'company/:id', component: CompanyComponent}
]}];

你可以简单地调用组件  router.navigate(['/', 'company', 1], { queryParams: { sample: true } });

答案 1 :(得分:0)

从路由器模块导入activatedRoute并在组件内分配查询参数

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

export class CompanyComponent { 

  isSample: boolean; 

  constructor(private routeParams: ActivatedRoute) { 
    this.isSample = routeParams.snapshot.params['sample']; 
  }

}