title: Angular 4 + PrimeNG Menu - Multiple menu items shown as active
body: <p>I am using </p>
  
  <blockquote>
    <p>Angular 4.1.2 and PrimeNG 4.3.0</p>
  </blockquote>
  
  <p>Issue I have having is with the <code>PanelMenu</code> i.e. <code>p-panelMenu</code> control.</p>
  
  <p>The following is the structure of my Menu</p>
  
  <pre><code>{
      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'] },
          ]
  },
  </code></pre>
  
  <p>The issue I have is that whenever "<strong>New</strong>" is clicked, both "<strong>Open</strong>" and "<strong>New</strong>" get selected.</p>
  
  <p>I have tried to avoid that by putting <code>routerLinkActiveOptions: "{exact:true}"</code> but it seems to not have any effect either.</p>
  
  <p>Any pointers to documentation regarding API for <code>routerLinkActiveOptions</code> will be appreciated as well. Currently, i am unable to understand what properties / values I can set as options using <code>routerLinkActiveOptions</code></p>