Question

我有一个angular2应用程序（RC5），我有一个章节组件。这基本上有一个大模板文件 - chapter.html - 其中包含：

<div *ngIf="chapter == 1">
<!-- Chapter 1 content -->
</div>
<div *ngIf="chapter == 2">
<!-- Chapter 2 content -->
</div>
<!-- etc. -->

然后我为 next 和之前的章节提供了一些箭头按钮。这些触发事件，例如

if (this.chapter !== '6') {
  var next = parseInt(this.chapter) + 1;
  console.log(next);
  let link = ['/tutorial/chapter', next];
  this.router.navigate(link);
}

因此，一切正常，按钮位于章节的底部，因此单击它们时，将显示下一章，但会自动向下滚动。所以在路由器上单击，我想触发一个事件并滚动到页面顶部，但是，当我导航到同一个组件时，ngOnInit()不会被触发。

我该怎么做？

Answer 1

如果您导航到同一个组件，至少参数已更改，否则路由器将无法重新导航。

您可以订阅参数更改并调用滚动更改

constructor(private route:ActivatedRoute) {
  this.route.params.forEach(p => this.doScroll());
}

Answer 2

constructor(private route:ActivatedRoute) {
  this.route.params.subscribe(params => {
        //do your stuffs...
  });
}

如何在组件导航到时触发事件？

2 个答案: