call function inside setInterval

Question

I want to call one function when timer value becomes 0. When I click on card, one popup opens and then timer starts. Below is the code:

openModal() {
  switch (area) {
    case 'a':
      var self_t = this;
      uid = 11;
      let timer = 20;
      let interval = setInterval(function () {
          let elementID = document.getElementById('float-div');
          if(elementID == null) {
            timer = this.inSeconds;
          }
          if(timer >= 0) {
            if(elementID) {
              elementID.innerHTML = String(timer);
            }
          }
          if (--timer == 0) {
              if(elementID) {
                  elementID.innerHTML = '0';
              }
              if(area == "a") {
                 self_t.callFunction(uid); // here it is not going, I put debugger here but i can see it doesn't go here!                          
                 clearInterval(interval);
              }
          }
    }, 1000);
    break;

    case 'b':
    console.log('something else');
    break;
  }
}

callFunction(uid) {
  console.log(uid);
}

already tried: using var self=this

If I use this.callFunction(uid) then it throws an error.

write you `setInterval` using arrow functions and that will do the trick. — Manish, Oct 10 '19 at 05:50
You can check this https://stackoverflow.com/questions/58218743/angular-xrm-webapi-cannot-assign-result-to-class-variable/58218862#58218862 — Paresh Gami, Oct 10 '19 at 05:51
@Manish I didnt get that, how to use in my code, bcoz I have certain conditions to check, when timer == 0 then call that function. — Pathik Vejani, Oct 10 '19 at 05:53

Manish · Accepted Answer · 2019-10-10T05:59:41.967

Use arrow function for this. Below is a snippet try this out it will do the trick. Read more about Arrow functions

openModal() {
  switch (area) {
    case 'a':
      uid = 11;
      let timer = 20;
      let interval = setInterval(() => {
        let elementID = document.getElementById('float-div');
        if (elementID == null) {
          timer = this.inSeconds;
        }
        if (timer >= 0) {
          if (elementID) {
            elementID.innerHTML = String(timer);
          }
        }
        if (--timer == 0) {
          if (elementID) {
            elementID.innerHTML = '0';
          }
          if (area == "abc") {
            this.callFunction(uid); // here it is not going, I put debugger here but i can see it doesn't go here!                          
            clearInterval(interval);
          }
        }
      }, 1000);
      break;

    case 'b':
      console.log('something else');
      break;
  }
}

callFunction(uid) {
  console.log(uid);
}

UPDATE:

No need of the below statement when using arrow functions. this will be available inside the function.

  var self_t = this;

Hope this helps :)

you are welcome. Glad could help :) – Manish Oct 10 '19 at 06:49 — Manish, Oct 10 '19 at 06:49

score 1 · Answer 2 · answered Oct 10 '19 at 05:56

1

Maybe you should modify these codes

 if(elementID == null) {
            timer = this.inSeconds;
          }

to

 if(elementID == null) {
            timer = self_t.inSeconds;
          }

answered Oct 10 '19 at 05:56

Chivenh

114
4

I am getting timer value, the problem is only can't call the function! – Pathik Vejani Oct 10 '19 at 05:57
I found some joke codes....;`if (area == "abc") {` will never be true when you use it in the `case 'a'` block;I'm not sure, is that the problem? – Chivenh Oct 10 '19 at 06:02
This is just test code! – Pathik Vejani Oct 10 '19 at 06:04

call function inside setInterval

2 Answers2