幻灯片菜单routerLink信息在执行期间被更改

Question

[我在有角度的Web应用程序中使用slideMenu模块（https://www.primefaces.org/primeng/showcase/#/menumodel）。最初，我在MenuItem中传递了url，但它刷新了我的整个页面，然后加载了相应的组件。

因此，每当我想到使用routerLink而不是url时，都无需刷新页面。但这会引发错误，因为它替换了某些特殊字符，例如我将routerLink传递为“ / wf / admin？processKey = 3DAM80-766”，但在渲染时将链接替换为“ / wf / admin％3FprocessKey％3DAM80-766”。

export class MenuDemo {

    items: MenuItem[];

    ngOnInit() {
        this.items = [{
            label: 'File',
            id: 102,
            icon: "fa fa-fw fa-check",
            items: [
                    label: "Maps",
                    id: 1021,
                    routerLink: ["/wf/admin?processKey=AM80-766"],
                    routerLinkActiveOptions: { exact: true }
            ]
        }
}

<div>
  <p-slideMenu [model]="items" [viewportHeight]="650" [menuWidth]="250"
    [style]="{ width: '250px', height: '100%', overflow: 'scroll' }">
  </p-slideMenu>
</div>

RouterLink通过替换特殊字符来中断路由时如何处理？

Answer 1

您可以尝试分解routerLink并使用该项目上的queryParams属性...

{
  label: "Maps",
  id: 1021,
  routerLink: ["wf", "admin"],
  queryParams: { processKey: "AM80-766" },
  routerLinkActiveOptions: { exact: true }
}