I am attempting to access the properties of an HTMLElement while working within the context of a fat arrow function. My objective is to determine when a user reaches the bottom of a virtualScroll element.
Although I have managed to successfully console log the end of the virtual scroll, I have encountered difficulties in storing this information in a variable that can be utilized by Typescript. Below is the code that currently works...
let virtualScroll = document.getElementById("virtualScroll") as HTMLElement;
virtualScroll.addEventListener('scroll', function(e){
let x: boolean = false;
if(this.scrollTop + this.clientHeight == this.scrollHeight){
x = true;
};
console.log('virtualScroll END?: ', x);
return(x); // Unfortunately, even this cannot be used :<
})
However, my lack of understanding regarding the scope in fat arrow functions has hindered me from accessing "this.scrollTop" and other "this." properties.
virtualScroll.addEventListener('scroll', e => {
console.log( Object.getPrototypeOf(e).scrollHeight );
})
The output from the second function consistently returns "undefined", indicating that there is an error in my implementation.