Base solution for your next web application
Open Closed

Angular 7 Dynamic Side Bar Menu Problem #7030

0
globalbilgi created

Merhaba,

.Net Core & Angular projesinde sol menüyü dinamik hale getirmek istiyorum. Gerekli servisleri .net ve angular tarafında yazdım ve SideBarMenuComponent 'inde menu:AppMenu değişkenini :

this._appNavigationService.GetUserMenu().subscribe(res => { this.menu = res; console.log("res,appmenu this.menu", res, this.menu); });

Yukarıdaki gibi set ediyorum fakat sayfa load olana kadar 74 kere aşağıdaki gibi menu items bulunamadı hatası veriyor. Bende bunu çözmek için ngif="menu" yapıyorum bu seferde sol menu hiç dolmuyor. Sadece mouse ile üzerine geldiğimde doluyor.

Bu sorunu çözmek için ne yapmalıyım ?

Go to accepted answer
8 Answer(s)
  • 0
    ismcagdas created
    Support Team

    Merhaba,

    Peki son durumda "ngIf" kullandığınızda console'a herhangi bir log yazılıyor mu ?

  • 0
    globalbilgi created

    Hayır, sadece mouse ile sol menu üzerine geldiğimde menu yu tetikleyip dolduruyor diğer turkü arkada menu içeriğini ne kadar değiştirirsem değiştireyim ekrana yansımıyor. Neyin engellediğini bir türlü bulamadık.

  • 0
    ismcagdas created
    Support Team

    Merhaba,

    Menu'yü alan kodu ngAfterViewInit içerisine alıp, onun subscribe kısmına da setTimeout kodunu taşıyabilir misiniz ?

  • 0
    globalbilgi created 
      ngAfterViewInit(): void {
        this._appNavigationService.GetUserMenu().pipe(finalize(() => setTimeout(() => {
            this.layoutRefService.addElement('asideLeft', this.el.nativeElement);
        })))
            .subscribe(res => {
                this.menu = res;
            });
    }

    yukarıdaki gibi ya da direkt olarak subscribe içerisine menuyu set ettikten sonra setTimeout konudu çalıştrdım ama bir fark olmadı. Html tarafta ngif kullandığımda hiç bir şekilde tetiklemiyor. Ngif kullanmadığımdada sürekli hata veriyor menu items null olduğu için.
  • 0
    globalbilgi created 
      this._appNavigationService.GetUserMenu()
            .subscribe(res => {
                this.menu = res;
                setTimeout(() => {
                    this.layoutRefService.addElement('asideLeft', this.el.nativeElement);
                });
            });

    Bu şekilde de bir fark olmadı maalesef.

  • 0
    globalbilgi created

    Merhaba, Bu sorunu hala çözemedik.

    İyi çalışmalar.

  • 1
    ismcagdas created
    Support Team

    Merhaba,

    Gecikme için özür dileriz, biz de daha önce bu şekilde bir kullanım denemediğimiz için biraz zamanımızı aldı çözümü bulmak.

    Çözüm olarak side-bar-menu.component.ts içerisinde changeDetection: ChangeDetectionStrategy.OnPush kısmını changeDetection: ChangeDetectionStrategy.Default olarak değiştirebilirsiniz. Bu kısmı nasıl olduysa gözden kaçırmışız.

    Sayfanın ilk açılışında hata almamak için de menu tanımını aşağıdaki gibi değiştirebilirsiniz:

    menu: AppMenu = new AppMenu('', '', []);

  • 0
    globalbilgi created

    Merhaba,

    ChangeDetectionStrategy.Default olarak yaptığımızda sorun düzeldi.

    Teşekkürler

Assignee
No one
Labels
Non yet