2017-07-21 90 views
0

我試圖按照Josh Morony的示例代碼, 但我似乎無法找到如何解決此問題。無法解析LocationTracker的所有參數

我從控制檯得到一個錯誤,它顯示在webrowser上,甚至在設備上。

我已經加入了插件:

$ ionic cordova plugin add cordova-plugin-geolocation 
$ npm install --save @ionic-native/geolocation 
$ ionic cordova plugin add cordova-plugin-mauron85-background-geolocation 
$ npm install --save @ionic-native/background-geolocation 

以下是錯誤消息

Uncaught Error: Can't resolve all parameters for LocationTracker: ([object Object], [object Object], [object Object], ?).at syntaxError (file:///android_asset/www/build/vendor.js:79310:34) 
    at CompileMetadataResolver._getDependenciesMetadata (file:///android_asset/www/build/vendor.js:92647:35) 
    at CompileMetadataResolver._getTypeMetadata (file:///android_asset/www/build/vendor.js:92515:26) 
    at CompileMetadataResolver._getInjectableMetadata (file:///android_asset/www/build/vendor.js:92501:21) 
    at CompileMetadataResolver.getProviderMetadata (file:///android_asset/www/build/vendor.js:92791:40) 
    at file:///android_asset/www/build/vendor.js:92720:49 
    at Array.forEach (native) 
    at CompileMetadataResolver._getProvidersMetadata (file:///android_asset/www/build/vendor.js:92681:19) 
    at CompileMetadataResolver.getNgModuleMetadata (file:///android_asset/www/build/vendor.js:92336:50) 
    at JitCompiler._loadModules (file:///android_asset/www/build/vendor.js:103400:66) 

頁/家庭/ home.ts

import { Component } from '@angular/core'; 
import { NavController } from 'ionic-angular'; 
import { LocationTracker } from '../../providers/location-tracker/location-tracker'; 

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

constructor(public navCtrl: NavController, public locationTracker: LocationTracker) { 

    this.startTracking(); 
    } 

    startTracking(){ 
    this.locationTracker.startTracking(); 
    } 

    stopTracking(){ 
    this.locationTracker.stopTracking(); 
    } 
} 

/頁/家庭/家。 html

<ion-content padding> 
    <ion-label>Current Latitude: {{locationTracker.lat}</ion-label> 
    <ion-label>Current Longitude: {{locationTracker.lng}}</ion-label> 
</ion-content> 

/providers/location-tracker/location-tracker.ts

import { Injectable, NgZone } from '@angular/core'; 
import { BackgroundGeolocation } from '@ionic-native/background-geolocation'; 
import { Geolocation, Geoposition } from '@ionic-native/geolocation'; 
import 'rxjs/add/operator/map'; 
import 'rxjs/add/operator/filter'; 

@Injectable() 
export class LocationTracker { 

    public watch: any;  
    public lat: number = 0; 
    public lng: number = 0; 

    constructor(public zone: NgZone, public backgroundGeolocation: BackgroundGeolocation, public geolocation: Geolocation, public geoposition: Geoposition) { 

    } 

    startTracking() { 

    // Background Tracking 

    let config = { 
     desiredAccuracy: 0, 
     stationaryRadius: 20, 
     distanceFilter: 10, 
     debug: true, 
     interval: 2000 
    }; 

    this.backgroundGeolocation.configure(config).subscribe((location) => { 

     console.log('BackgroundGeolocation: ' + location.latitude + ',' + location.longitude); 

     // Run update inside of Angular's zone 
     this.zone.run(() => { 
     this.lat = location.latitude; 
     this.lng = location.longitude; 
     }); 

    }, (err) => { 

     console.log(err); 

    }); 

    // Turn ON the background-geolocation system. 
    this.backgroundGeolocation.start(); 


    // Foreground Tracking 

    let options = { 
     frequency: 3000, 
     enableHighAccuracy: true 
    }; 

    this.watch = this.geolocation.watchPosition(options).filter((p: any) => p.code === undefined).subscribe((position: Geoposition) => { 

     console.log(position); 

     // Run update inside of Angular's zone 
     this.zone.run(() => { 
     this.lat = position.coords.latitude; 
     this.lng = position.coords.longitude; 
     }); 

    }); 
    } 

    stopTracking() { 
    console.log('stopTracking'); 

    this.backgroundGeolocation.finish(); 
    this.watch.unsubscribe(); 
    } 
} 

應用程序/ app.module.ts

import { BrowserModule } from '@angular/platform-browser'; 
import { ErrorHandler, NgModule } from '@angular/core'; 
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular'; 
import { MyApp } from './app.component'; 
import { HomePage } from '../pages/home/home'; 
import { StatusBar } from '@ionic-native/status-bar'; 
import { LocationTracker } from '../providers/location-tracker/location-tracker'; 
import { BackgroundGeolocation } from '@ionic-native/background-geolocation'; 
import { Geolocation } from '@ionic-native/geolocation'; 


@NgModule({ 
    declarations: [ 
    MyApp, 
    HomePage 
    ], 
    imports: [ 
    BrowserModule, 
    IonicModule.forRoot(MyApp), 
    HttpModule 
    ], 
    bootstrap: [IonicApp], 
    entryComponents: [ 
    MyApp, 
    HomePage 
    ], 
    providers: [ 
    StatusBar 
    {provide: ErrorHandler, useClass: IonicErrorHandler} 
    LocationTracker, 
    BackgroundGeolocation, 
    Geolocation 
    ] 
}) 
export class AppModule {} 
+0

它可以是離子2或3,但不能同時: )在標籤 – onetwo12

+0

嗨onetwo12, 你指的是標籤? –

+0

我明白你的意思了。我假設這個錯誤可能在兩者中。 –

回答

2

如果taje看看錯誤,它說,第四參數無法注入

Uncaught Error: Can't resolve all parameters for LocationTracker: ([object Object], [object Object], [object Object], ?) 

看你的代碼從注射

constructor(public zone: NgZone, 
      public backgroundGeolocation: BackgroundGeolocation, 
      public geolocation: Geolocation, 
      public geoposition: Geoposition) { 
} 

第四個是這個Geoposition,看起來你不是'提供'的NgModule。

所以,只要你不使用這個「geoposition」實例/對象,你可以簡單地從構造函數中刪除:

constructor(public zone: NgZone, 
      public backgroundGeolocation: BackgroundGeolocation, 
      public geolocation: Geolocation) { 
} 
+0

不錯..你的解釋幫助我理解如何更好地閱讀錯誤... – JGFMK

+0

非常感謝!我現在看到它。一旦我在明天進行測試,我會做出答案。 –

+0

你解釋得很好,準確。 –

相關問題