Ionic2: updating temple variable from callback function is very slow

I built a simple pedometer app based on tabs starter using Ionic2. I just make the app display steps in the home view. I see the pedometer callback handler being triggered but the steps in the home view is either not updated in real time or is updated very slowly (e.g. it will update after 30 steps) but meanwhile I saw 30 callback fired off.

I am wondering if this is a known issue or I did something wrong.

The link to my code on github git@github.com:chicheongweng/pedometer.git

home.ts:

import {Component} from ‘@angular/core’;
import {NavController} from ‘ionic-angular’;

declare var pedometer: any;

@Component({
templateUrl: ‘build/pages/home/home.html’,
})
export class HomePage {
public steps: number = 0;
constructor(private navCtrl: NavController) {
this.steps = 0;

pedometer.isStepCountingAvailable(
  ()=>{ console.log("Pedometer step counting available!")},
  ()=>{ console.log("Pedometer step counting not available!")}
);

pedometer.startPedometerUpdates(
  ()=>{ console.log("handler called back!"); this.steps += 1; },
  ()=>{ console.log("handler error")}
);

}
}

home.html:

Home

Ionic Pedometer

{{steps}}

1 Like