Angular 4 + PrimeNG 菜单 - 多个菜单项显示为事件状态

我在用



我遇到的问题是 PanelMenu，即 p-panelMenu 控件。

以下是我的Menu的结构

{
    label: 'Demo',
    icon: 'fa-shield',
    items: [{
        label: 'Proposal',
        items: [
            { label: 'New', icon: 'fa-plus', routerLink: ['/proposal/create'], routerLinkActiveOptions: "{exact:true}" },
            { label: 'Open', icon: 'fa-search', routerLink: ['/proposal'] },
        ]
},

我遇到的问题是，每当单击“ New ”时，“ Open ”和“ New ”都会被选中。

我试图通过放置 routerLinkActiveOptions: "{exact:true}" 来避免这种情况，但它似乎也没有任何效果。

任何指向有关 routerLinkActiveOptions 的 API 的文档的指针也将不胜感激。目前，我无法理解可以使用 routerLinkActiveOptions 将哪些属性/值设置为选项

最佳答案

要解决此问题，请对您的菜单模型进行以下更改:

{
标签:'演示'，
图标:'fa-盾'，
项目: [{
标签:'提案',
项目: [
{标签:'新'，图标:'fa-plus'，routerLink:['/proposal/create']，routerLinkActiveOptions:{精确:真}}，
{ label: 'Open', icon: 'fa-search', routerLink: ['/proposal'], routerLinkActiveOptions: { exact: true } },
]
}]
}

完整示例如下:https://stackblitz.com/edit/angular-a27wca