AngOngInit不能用於路由共享組件

我有一個組件「MenuComponent」，它在邊欄中單擊鏈接時加載菜單。「MenuComponent」是通過<router-outlet></router-outlet>「MenusComponent」的子節點當我單擊側邊欄中的菜單時，鏈接變爲下列之一。AngOngInit不能用於路由共享組件

#/cms/menus/1/menus/1 
#/cms/menus/1/menus/3 
#/cms/menus/1/menus/5 
#/cms/menus/1/menus/6

我想加載菜單，並設置一些屬性，每當鏈接被點擊。我這樣做;

ngOnInit() { 
     let menuid = this.route.snapshot.params.id; 
     this.LocalService.PlacementMenus.Activate(menuid); 
    this.Initialise(); 
    this.LocalService.changeMenuComponents('menuList'); 
     let placementid = this.route.snapshot.params.placementid; 
     this.LocalService.AllPlacements.Activate(placementid); 
    }

但ngOnInit第二次單擊邊欄中的菜單時不起作用。我看到有其他的鉤子，例如;

ngAfterContentInit() 
ngAfterViewInit()

但是這些都不起作用。

來源

2017-08-01 LogicDev

如果包含鏈接的側邊欄組件位於router-outlet之外，那麼它將不會在導航上重新加載，如果由於某種原因，您確實需要側邊欄每次都重新生成，則需要將其放置在出口中。這就是說，觀察回答中所描述的路線變化將更爲有效。 –

我不想重新加載邊欄。我想要組件重新生成 – LogicDev

快照就是這樣，在特定時間點的快照：

this.route.snapshot.params.id;

使用可觀察到的來代替。然後每次參數更改時都會更新。

this.route.params.subscribe(
    params => { 
     let menuid = +params['id']; 
     // OR let menuid = +paramMap.get('id'); 
     this.LocalService.PlacementMenus.Activate(menuid); 
     this.Initialise(); 
     this.LocalService.changeMenuComponents('menuList'); 
     let placementid = this.route.snapshot.params.placementid; 
     this.LocalService.AllPlacements.Activate(placementid); 
    } 
);

對於一個小更乾淨的代碼，你可以添加上述所有方法調用到一個方法，並呼籲從內部認購。

來源

2017-08-01 19:21:02 DeborahK

但是爲什麼組件本身沒有重新加載？我希望組件在每次鏈接被點擊時重新加載，就像它是一個新組件一樣。 – LogicDev

你的解決方案似乎工作。也許我不明白ngOnInit是如何工作的。每次單擊鏈接時是否有重新加載整個組件的方法？ – LogicDev

編號。ngOnInit只執行一次...組件第一次創建時。但您可以使用上面所示的技術觀察參數更改。 – DeborahK

AngOngInit不能用於路由共享組件

回答

相關問題