how to call api in time interval in ionic

Question

I am working on ionic framework and i want to call API call in some time interval for ex. every 30 seconds, i want to start and stop this API call manually using button or something else. as i am new in ionic framwork i dont know how to achieve that, all i know is to call api, but i don't know how to call API in specific time interval, starting and stopping manually. so can anyone help me? thanks is advance. what i have done till now is below,

authenticate.ts

import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';

@Injectable()
export class AuthenticateProvider {

    body: any;
//  apiUrl = 'https://jsonplaceholder.typicode.com';
    apiUrl = 'http://dev123:5800/api';

    getToken(body) {

      if (this.body) {
        return Promise.resolve(this.body);
      }

      return new Promise((resolve,reject) => {
        this.http.post(this.apiUrl+'/authenticate',body)
            .subscribe(res => {
                resolve(res);
            }, (err) => {
                reject(err);
            });
      });
    }

}

login.ts

export class LoginPage {

constructor(public navCtrl: NavController,
        public authenticateProvider: AuthenticateProvider) {
    }

getToken() {
    this.authenticateProvider.getToken(this.creds)
        .then(result => {
            if (JSON.parse(result.text()).response !== "OK") {
                this.err = JSON.parse(result.text()).response;
            } else {
                dosomething();

            }
        }, (err) => {
            console.log("Error is" + err);
        });

    }

}

I suppose you need something like plain `setInterval()`. [link to MDN](https://developer.mozilla.org/en-US/Add-ons/Code_snippets/Timers) — Mykola Shchetinin, Oct 13 '17 at 12:30
Possible duplicate of [Angular2 http at an interval](https://stackoverflow.com/questions/35316583/angular2-http-at-an-interval). — David, Oct 13 '17 at 12:39
Create a service which contains the APIs to pause / resume it. when resume() is called do this.interval = setInterval(...). when pause() is called perform clearInterval(this.interval) — Philip Brack, Oct 13 '17 at 19:50

score 0 · Answer 1 · answered Oct 14 '17 at 18:14

Create the service (I forgot its called provider these days)

ionic g provider interval

The provider code:

//interval.ts

import {Injectable} from '@angular/core';

@Injectable()
export class IntervalProvider {

  intervalHandle: any = null;

  constructor() {

  }

  toggleInterval() {

    if (this.intervalHandle === null) {
      this.intervalHandle = setInterval(() => {
        this.callAPI();
      }, 1000);
    } else {
      clearInterval(this.intervalHandle);
      this.intervalHandle = null;
    }

  }

  callAPI() {
    console.log('API called');
  }

}

Injecting and using the provider. The function toggleInterval() I am calling from a button click.

//home.ts 
import { Component } from '@angular/core';
import {IntervalProvider} from '../../providers/interval/interval';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  constructor(private intervalProvider: IntervalProvider) {

  }

  // called by your click button
  toggleInterval() {
    this.intervalProvider.toggleInterval();
  }

}

ok i'll try this and get back to you, but tell me one thing how to clear interval by calling toggleInterval()? what to do with this.intervalHandle? to clear interval. — gaurang, Oct 23 '17 at 06:09
See in toggleInterval `clearInterval(this.intervalHandle)`. this will stop the timer from going off. You could if you prefer have a pause / resume function and call `clearInterval` and `setInterval` respectively. — Philip Brack, Oct 23 '17 at 14:35

how to call api in time interval in ionic

1 Answers1