NbMenuItemComponent wrong maxHeight

[Ahmore]

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: Error ExpressionChangedAfterItHasBeenCheckedError is gone but max-height still is not as expected. It equals 16px. And my submenu is still hidden like before. Look at screen below.

Expected behavior: Should adjust to correct height to show all options in menu.

Steps to reproduce:

1. Install the latest version
2. browse to http://localhost:4200/
3. Click on the Auth menu item
4. Click on Login
5. Login
6. Auto redirect to whatever page
7. Menu btn are hidden

Other information:

npm, node, OS, Browser

Node: v8.11.1, npm: 5.6.0
OS: Windows 10
Browser: Chrome

Angular, Nebular

"@agm/core": "1.0.0-beta.2",
    "@angular/animations": "~5.2.6",
    "@angular/common": "~5.2.6",
    "@angular/compiler": "~5.2.6",
    "@angular/core": "~5.2.6",
    "@angular/forms": "~5.2.6",
    "@angular/http": "~5.2.6",
    "@angular/platform-browser": "~5.2.6",
    "@angular/platform-browser-dynamic": "~5.2.6",
    "@angular/router": "~5.2.6",
    "@asymmetrik/ngx-leaflet": "3.0.1",
    "@nebular/auth": "2.0.0-rc.6",
    "@nebular/security": "2.0.0-rc.6",
    "@nebular/theme": "2.0.0-rc.7",
    "@ng-bootstrap/ng-bootstrap": "1.0.0",
    "@swimlane/ngx-charts": "7.0.1",
    "angular2-chartjs": "0.4.1",
    "angular2-toaster": "4.0.1",
    "bootstrap": "4.0.0",
    "chart.js": "2.7.1",
    "ckeditor": "4.7.3",
    "classlist.js": "1.1.20150312",
    "core-js": "2.5.1",
    "echarts": "^4.0.2",
    "font-awesome": "4.7.0",
    "intl": "1.2.5",
    "ionicons": "2.0.1",
    "leaflet": "1.2.0",
    "nebular-icons": "1.0.6",
    "ng2-ckeditor": "1.1.13",
    "ng2-smart-table": "^1.2.2",
    "ng2-tree": "2.0.0-rc.4",
    "ngx-echarts": "2.0.1",
    "normalize.css": "6.0.0",
    "pace-js": "1.0.2",
    "roboto-fontface": "0.8.0",
    "rxjs": "5.5.5",
    "socicon": "3.0.5",
    "tinymce": "4.5.7",
    "typeface-exo": "0.0.22",
    "web-animations-js": "2.2.5",
    "zone.js": "0.8.18"

[marchrius]

Save behavior when setting menu items with property to hidden. The height calculated is not correct and the sub-menu are hidden.

[wshaver]

This is a bit of an ugly workaround, but until it is fixed, this is better than nothing:

Added to my sample.layout.ts constructor:

this.menuService.onSubmenuToggle().subscribe(obs => {
 if (obs.item.expanded) {
  obs.item.subMenuHeight = (obs.item.children.length * 40); 
 }
});