Description
Issue type
Bug with changeDetection: ChangeDetectionStrategy.OnPush OR NbMenuComponent.html
I'm submitting a ...
- bug report
- feature request
Issue description
I am using <nb-menu tag="menu" [items]="menuItems"></nb-menu> and my menu items are dynamic and i am calling api on ngOnInit But after i get response menu doesnt get updated and if i call this.cd.detectChanges() after success it throws
ERROR TypeError: "_v.context.$implicit is undefined"
and the menu works fine. That means my HTML doesn't update when the menu gets.
Current behavior:
As mention Above. and also if i remove this.cd.detectChanges() i have to open and close inspector window to view menu.
Expected behavior:
The menu should be refreshed on the success of the api call.
Related code:
imports in app.component.ts:
import { Component, OnInit, ChangeDetectionStrategy, ChangeDetectorRef, OnDestroy } from '@angular/core';
import { NbSidebarService, NbIconLibraries, NbToastrService } from '@nebular/theme';
import { WishserviceService } from '../app/wishservice.service';
import { takeWhile } from 'rxjs/operators';
import { from, pipe } from 'rxjs';
ngOnInit:
ngOnInit() {
this.loading = true;
this.services.getMainMenu()
.pipe(takeWhile(() => this.alive))
.subscribe((res)=>{
console.log(res.Status);
if(res.Status == "success")
{
this.menu1 = res.data
for (let i = 0; i < this.menu1.length; i++) {
this.services.getSubMenu(this.menu1[i]['menuId']).subscribe((res)=>{
this.menu2 = res.data
let newchild = []
for (let i = 0; i < this.menu2.length; i++) {
newchild[i] = {
title : this.menu2[i]['subMenuName'],
link : []
}
}
this.menuItems[i] = {
"title":this.menu1[i]['mainMenuName'],
"icon":this.menu1[i]['iconHtml'],
"children":newchild
}
this.loading = false;
this.cd.detectChanges() // Here i called detect changes if i remove this menu doesnt gets updated.
}, (err)=>{
console.log(JSON.stringify(err));
});
}
}
else {
this.toastrService.show("status", "TOAST", "Top-right");
}
}, (err)=>{
console.log(JSON.stringify(err));
});
console.log("---------------->",this.menuItems);
}
Other information:
IF YOU NEED ANY COMMENT.