Breaking News: Grepper is joining You.com. Read the official announcement!

on scroll end call a method in javascript/angular

Bilal Ahmad answered on December 23, 2022 Popularity 2/10 Helpfulness 1/10

answer on scroll end call a method in javascript/angular

related get Scroll end event or api call on Scrolling Angular

on scroll end call a method in javascript/angular

Comment

<!----- HTML ----->
<div class="image-list" (scroll)="onScroll()">
<div>
  
<!----- JS/TS ---->
  lastScrollPosition = 0;
  @HostListener('window:scroll', ['$event'])
  onScroll() {
    const raw: any = document.querySelector('.image-list');
    const currentScrollPosition = raw.scrollTop;

    if (currentScrollPosition > this.lastScrollPosition) {
      // Scrolling down
      if (currentScrollPosition + raw.clientHeight >= raw.scrollHeight - 5) {
        this.getData();
      }
    }

    this.lastScrollPosition = currentScrollPosition;
  }

Popularity 2/10 Helpfulness 1/10 Language javascript

Source: Grepper

Tags: call javascript scroll

Link to this answer
Share Copy Link

Contributed on Dec 11 2023

Bilal Ahmad

0 Answers Avg Quality 2/10

Closely Related Answers

get Scroll end event or api call on Scrolling Angular

Comment

<div #listing  (scroll)="onWindowScroll()"> 
apply id on those div whic scroll show 
<div>
 @ViewChild('listing') lsitingScroll: ElementRef;

@HostListener("window:scroll", ["$event"])
onWindowScroll() {
 const {scrollHeight, clientHeight, scrollTop} = this.lsitingScroll.nativeElement
if(scrollTop + Math.round(clientHeight + 0.5)  >= scrollHeight){
  this.scrollingEvent.emit();
  console.log("api call here");
  

  }
}

Popularity 3/10 Helpfulness 2/10 Language javascript

Source: Grepper

Tags: angular scroll javascript api get call

Link to this answer
Share Copy Link

Contributed on Dec 23 2022

Ugliest Unicorn

0 Answers Avg Quality 2/10

on scroll end call a method in javascript/angular

Contents

More Related Answers

on scroll end call a method in javascript/angular

Closely Related Answers

get Scroll end event or api call on Scrolling Angular

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.