Question

以前类似的StackOverflow问题的解决方案都集中在Jquery上，而找不到针对angular 6 / Javascript的解决方案。

当前，我使用的是scrollIntoView（），其行为可以平滑地滚动到使用路由器出口的动态创建的div，但是它仅在第二次单击后才滚动，我的代码是否有错误或是否可以在其中实现第一次点击？

HTML：

<div>
  <mat-card-title (click)="articleNavigation(documents._id)">{{documents.title}}</mat-card-title>
</div>
<div #test style="width:50%; margin-left: auto; margin-right: auto;">
  <router-outlet></router-outlet>
</div>

ts：

articleNavigation(documentId) {
 this.router.navigate(['./document' , documentId], { relativeTo: this.route });
 this.test.nativeElement.scrollIntoView({behavior: 'smooth'});
}

如果我使用行为自动而不是平滑操作，则在第一次单击时就可以使用，但是首选平滑过渡。我认为可能的原因之一是在第一次单击时创建了div，然后在第二次单击时将scrollIntoView（）转换为div。

Answer 1

尝试一下：

setTimeout(() => {
    this.test.nativeElement.scrollIntoView({behavior: 'smooth'});
});

第一次单击时如何使scrollIntoView（）工作（角度6）？

1 个答案: