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

Question

我有一个 angular2 应用程序 (RC5)，其中有一个 chapter 组件。这基本上有一个很大的模板文件 - chapter.html - 其中有:

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

然后我有一些箭头按钮用于下一 和上一 章节。这些会触发一个事件，例如

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