Я новичок в Ionic и Typescript, так что извиняюсь, если у меня есть эта задница о лице!
Я пытаюсь создать простое приложение для iOS и Android с Ionic 2, которое просто отображает текущее местоположение пользователей, обновляющееся по мере их перемещения.
Проблема, с которой я сталкиваюсь, заключается в том, что пока я, кажется, получаю координаты, входящие в пользовательский интерфейс, никогда не обновляется, чтобы отображать обновленное местоположение.
Я создал провайдера, использующего плагин cordova-plugin-mauron85-background-geolocation как location.ts:
import { Injectable, NgZone} from '@angular/core';
import { BackgroundGeolocation } from 'ionic-native';
@Injectable()
export class LocationProvider {
public message: any = "I'm new here";
public latitude:number = 0.0;
public longitude:number = 0.0;
private zone: NgZone;
constructor() {
this.initialiseLocationManager();
}
initialiseLocationManager() {
let config = {
desiredAccuracy: 1,
stationaryRadius: 1,
distanceFilter: 1,
interval:1000,
activityType:'AutomotiveNavigation',
debug: true,
stopOnTerminate: true,
};
BackgroundGeolocation.configure(config)
.then(this.locationUpdated)
.catch((error) => {
console.log('BackgroundGeolocation error');
});
}
private locationUpdated(location) {
console.log('******* NEW LOCATION ********');
this.zone.run(() => {
this.latitude = location.latitude;
this.longitude = location.longitude;
});
BackgroundGeolocation.finish(); // FOR IOS ONLY
}
private error(error) {
console.log('ERROR');
}
public startTracking() {
BackgroundGeolocation.start();
}
public stopTracking() {
BackgroundGeolocation.stop();
}
}
Затем я ввожу это в свою страницу test.ts:
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import {LocationProvider} from '../../providers/location/location';
@Component({
templateUrl: 'build/pages/test/test.html',
})
export class TestPage {
constructor(private nav: NavController, private locationProvider:LocationProvider) {
}
startTracking() {
this.locationProvider.startTracking();
}
stopTracking() {
this.locationProvider.stopTracking();
}
}
Содержимое моей страницы:
<ion-header>
<ion-navbar>
<button menuToggle>
<ion-icon name="menu"></ion-icon>
</button>
<ion-title>Test</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
<button (click)="startTracking()">
Start Tracking
</button>
<button (click)="stopTracking()">
Stop Tracking
</button>
<ion-item>Latitude / Longitude</ion-item>
<ion-item>
{{locationProvider.latitude}},{{locationProvider.longitude}}
</ion-item>
</ion-content>
Когда я компилирую мое приложение для iOS и запускаю его в Xcode, он выглядит так, как я ожидаю, когда я нажимаю кнопку "Отслеживание запуска", я вижу записи в консоли Xcode, которые предполагают, что местоположение получается правильно.
2016-08-06 12:37:17:370 Test[3264:62403] Better location found: Location: id=0 time=140310177131584 lat=51.8724580445 lon=-2.26443678245263 accu=5 aaccu=-1 speed=-1 head=-1 alt=0 type=current
2016-08-06 12:37:17:371 Test[3264:62403] LocationManager queue Location: id=0 time=140310177131584 lat=51.8724580445 lon=-2.26443678245263 accu=5 aaccu=-1 speed=-1 head=-1 alt=0 type=current
2016-08-06 12:37:18:370 Test[3264:62403] LocationManager didUpdateLocations (operationMode: 1)
2016-08-06 12:37:18:370 Test[3264:62403] Location age 0.001122
2016-08-06 12:37:18:370 Test[3264:62403] Better location found: Location: id=0 time=140310177372752 lat=51.8726980292 lon=-2.26504136905789 accu=5 aaccu=-1 speed=-1 head=-1 alt=0 type=current
2016-08-06 12:37:18:370 Test[3264:62403] LocationManager queue Location: id=0 time=140310177372752 lat=51.8726980292 lon=-2.26504136905789 accu=5 aaccu=-1 speed=-1 head=-1 alt=0 type=current
Но координаты, отображаемые на странице, никогда не обновляются и не обновляют истинное местоположение.
Мне, вероятно, не хватает очевидного, но я не вижу его, поэтому любые предложения будут очень благодарны.