Javascript 如何基于用户触发操作';在页面上的视图是否有角度?

Javascript 如何基于用户触发操作';在页面上的视图是否有角度?,javascript,html,css,angular,angular-material,Javascript,Html,Css,Angular,Angular Material,我想有一个角度与多个小节,可以通过向下滚动或点击章节列表达到单一页面。 如果用户单击该部分,将触发滚动到该部分的操作,并突出显示用户当前位于页面中的特定部分 如何通过滚动来正确触发颜色高亮显示来跟踪用户何时到达特定分区?您可以通过@ViewChild或@ViewChildren获取分区 用… ts内部: 。。。 @ViewChildren('section')节:QueryList;//把你的部分拿到这里 @HostListener(“滚动”)滚动(){ 这个.checkScrollPositi

我想有一个角度与多个小节,可以通过向下滚动或点击章节列表达到单一页面。 如果用户单击该部分,将触发滚动到该部分的操作,并突出显示用户当前位于页面中的特定部分


如何通过滚动来正确触发颜色高亮显示来跟踪用户何时到达特定分区?

您可以通过@ViewChild或@ViewChildren获取分区

ts内部:

。。。
@ViewChildren('section')节:QueryList;//把你的部分拿到这里
@HostListener(“滚动”)滚动(){
这个.checkScrollPosition();
}
@HostListener(“调整大小”)滚动(){
这个.checkScrollPosition();
}
currentSectionId:编号;
构造函数(私有只读呈现程序:Renderer2){}
checkScrollPosition():void{
//使用window.scrollTop和sections[anyIndex].nativeElement.scrollTop检查您的文件是否在分区内
//如果您使用Angulars universal,则可以使用Angulars ViewportScroller
removeClass(节[this.currentSectionId].nativeElement,“带颜色的类”);
this.currentSectionId=anyIndex//通过搜索当前节获得的索引
renderer.addClass(节[this.currentSectionId].nativeElement,“带颜色的类”);
} 
HostListeners观察调整大小和滚动事件,以检查您的文件是否在当前节中

我懒得写如何找到当前的部分,我希望这能回答你的问题:D


另外,我还没有测试代码,但是应该是这样的

非常感谢!我不知道HostListener,有了它就有可能实现这个想法。