Call a function inside jQuery function

Question

I want to execute an exeternal function inside the JQuery method. The problem appear when I try to call the method, the one looks undefined. How could I solve this? I amb using Typescript with Angular 2

ngAfterViewInit() {

jQuery(".mo-table").scroll(function () {
  var trueDiveHeight = jQuery(".mo-table")[0].scrollHeight;
  var divHeight = jQuery(".mo-table").height();
  var scrollLeft = trueDiveHeight - divHeight;

  if (jQuery(".mo-table").scrollTop() >= scrollLeft - 150) {

    this.onSearch();

    console.log("new bottom")
   }
 });
}

The method onSearch is an external function, and is Undefined.

onSearch(): void {      
  this.updateTableReport(this.scrollId, this.buildParams())
}

Any help would be appreciated.

Possible duplicate of TypeScript 'this' scoping issue

n00dl3
– n00dl3

2017-03-28 07:36:51 +00:00
Commented Mar 28, 2017 at 7:36 — n00dl3
– n00dl3, Commented Mar 28, 2017 at 7:36

eko · Accepted Answer · 2017-03-28 07:40:22Z

2

Change

jQuery(".mo-table").scroll(function () {

to

jQuery(".mo-table").scroll( ()=> {

your this is not refering to your component

or the old js way:

ngAfterViewInit() {

var self = this; //<-- assign this to self here
jQuery(".mo-table").scroll(function () {
  var trueDiveHeight = jQuery(".mo-table")[0].scrollHeight;
  var divHeight = jQuery(".mo-table").height();
  var scrollLeft = trueDiveHeight - divHeight;

  if (jQuery(".mo-table").scrollTop() >= scrollLeft - 150) {

    self.onSearch(); //<-- use self here

    console.log("new bottom")
   }
 });
}

answered Mar 28, 2017 at 7:40

eko

40.8k11 gold badges79 silver badges104 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Jotan Over a year ago

It works! Thank you, I didn't knew the "self" logic. Why is this working? I mean, when we assign to this, is getting the reference for the whole page?

eko Over a year ago

@XGuy when you use the work function in javascript, you are creating a new scope. The this inside this scope refers to the lets say instance of this function. So this will refer to different things in and out of this function. More info on: stackoverflow.com/questions/20279484/…

Collectives™ on Stack Overflow

Call a function inside jQuery function

1 Answer 1

2 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Linked

Related