Question

我将routerLink与queryparams一起使用，并且如果我这样做，它将起作用：

[routerLink]="['/user/bob']" [queryParams]="{debug: true}"

但是我使用一个主题，并且菜单导航的路径在json对象中定义，我尝试这样做，但是params是未定义的。我的代码：

{
  label: 'Produto', icon: 'fa fa-fw fa-sitemap',
  items: [{label: 'Produto Agil', icon: 'fa fa-fw fa-columns', routerLink: ['/produtoagil']},
          {label: 'Grupo', icon: 'fa fa-fw fa-code', routerLink: ['/grupo']},
          {label: 'Marca', icon: 'fa fa-fw fa-table', routerLink: ['/entidadesimples'], queryparams: {entidade: 'marca'}},
          {label: 'Secao', icon: 'fa fa-fw fa-list-alt', routerLink: ['/entidadesimples'], queryparams: {entidade: 'secao'}},
          {label: 'Categoria', icon: 'fa fa-fw fa-square', routerLink: ['/entidadesimples'], queryparams: {entidade: 'categoria'}},
          {label: 'Subcategoria', icon: 'fa fa-fw fa-minus-square-o', routerLink: ['/entidadesimples'], queryparams:{entidade: 'subcategoria'}},
          {label: 'Unidade Produto', icon: 'fa fa-fw fa-circle-o-notch', routerLink: ['/entidadesimples'], queryparams: {entidade: 'unidadeproduto'}}
         ]
}

在ts中，我这样做是为了捕获参数：

 ngOnInit() {
    this.route.queryParams.subscribe(params =>{
    this.entidade = params['entidade']
    })
}

Answer 1

我看到menuitem interface处有queryParams。并且我看到它是在template中实现的。因此，只需尝试将queryParams与驼峰式键盘一起使用，而不要对queryparams（小写字母将不起作用）使用，例如：

...
{
  label: 'Marca', 
  icon: 'fa fa-fw fa-table', 
  routerLink: ['/entidadesimples'], 
  queryParams: {entidade: 'marca'}
}
...

STACKBLITZ

将查询参数传递给json对象angular

1 个答案: