All children menu items which start with same name(prefix) are highlighted when one selected.

[doodev]

Issue type

I'm submitting a ... (check one with "x")

• [x] bug report
• [ ] feature request
• [ ] question about the decisions made in the repository

Issue description

Current behavior:

When adding items starting with same name (prefix) as children to menu, all children are highlighted when one of them is selected.

Something like:

• ui features
  • grid
  • grid-sample

Both of them are highlighted when grid-sample selected, but only grid highlighted when grid selected. Gif included below to clarify.

Expected behavior:

Only the selected item should be selected.

Steps to reproduce:

Add a few children item under a parent menu item starting with same name. Like:

• parent
  • children
  • children-sample

Related code:

Git repo: Fork of ngx-admin with children added to menu

Duplicated grid component under pages/ui-features and renamed to grid-sample. Added to page-menu.

pages-menu.ts:

 {
        title: 'Grid',
        link: '/pages/ui-features/grid',
      },
      {
        title: 'Grid Sample',
        link: '/pages/ui-features/grid-sample',
 },

Other information:

npm, node, OS, Browser

<!--
Node, npm: `node --version` and `npm --version`
OS: Windows (7/8/10). Linux (incl. distribution). macOS (El Capitan? Sierra?)
Browser: Chrome/Safari/Firefox/etc?
-->

Node: v6.11.4, npm: 3.5.2 OS: Linux(Ubuntu 17.10) Browser: Chrome&Firefox

Angular, Nebular

<!--
Check your `package-lock.json` or locate a `package.json` in the `node_modules` folder.
-->

[nnixaa]

Hi @doodev, try setting pathMatch: full, for each of your menu items.

[doodev]

@nnixaa thank you, it solved the issue.