How to make a clickable function for ScrollViewInit() on Angular?

  angular, javascript, scroll, typescript

There is a design having a vertical scroll, it’s working when we run to execute it on constructor(), but if the user will change the scrollbar left/right (vertically) then hit the findEvent() button on the template then it will not working.

event.component.html

<div #refScroll (click)="findEvent()">Find Events</div>

event.component.ts

ViewChild('refScroll') refScroll:ElementRef;

constructor(){ 
     this.findEvent();
}

findEvent(){
this.refScroll.nativeElement.scrollIntoView({
   behaviour:'smooth',
   block:'center',
   inline:'center'  // we are using vertical scrollbar
})
}

It should work on click if a user will change the scrollbar manually.
Thanks

Source: Ask Javascript Questions

LEAVE A COMMENT