Question

我有一个组件＆＃34; MenuComponent＆＃34;在侧边栏中单击链接时加载菜单。＆＃34; MenuComponent＆＃34;是一个＆＃34; MenusComponent的孩子＆＃34;通过<router-outlet></router-outlet>当我点击侧边栏中的菜单时，链接会变为以下之一。

#/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()

但这些都不起作用。

Answer 1

快照只是一个特定时间点的快照：

this.route.snapshot.params.id;

请改用observable。然后每次参数更改时都会更新。

    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);
     }
  );

对于更干净的代码，您可以将所有上述方法调用添加到一个方法中，并从订阅内部调用它。

Angular ngOnInit不在路由共享组件上工作

1 个答案: