@ ionic-native/geolocation에서 Geolocation 구현

Question

Ionic Framework 프로젝트 V3에 있는데, 성공없이 getCurrentPosition 메서드를 사용하여 @ ionic-native/geolocation에서 Geolocation 모듈을 구현하려고합니다. 내가 <ion-col>

<ion-header> 

    <ion-navbar> 
    <ion-title>Add place</ion-title> 
    </ion-navbar> 

    </ion-header> 


<ion-content padding> 
<form (ngSubmit)="onAddPlace(f.value)" #f="ngForm"> 
    <ion-item> 
    <ion-label>Title</ion-label> 
    <ion-input type="text" name="title" ngModel required></ion-input> 
    </ion-item> 
    <button ion-button block type="submit" [disabled]="!f.valid">Add a place</button> 
</form> 
    <ion-grid> 
    <ion-row> 
    <ion-col><button ion-button block (click)="onLocatedUser()">Locate me</button></ion-col> 
    </ion-row> 
    <ion-row> 
    <ion-col> 
     <p>You location: </p> 
    </ion-col> 
    </ion-row> 
    </ion-grid> 


    </ion-content> 

01에 onLocatedUser() 메소드를 사용하여 데이터를 밀어 곳

import { Component } from '@angular/core'; 
import { IonicPage } from 'ionic-angular'; 
import { NavController } from "ionic-angular"; 
import { Geolocation } from '@ionic-native/geolocation'; 

import { PlacesService } from '../../services/places.service' 

@IonicPage() 
    @Component({ 
selector: 'page-new-place', 
templateUrl: 'new-place.html', 
}) 
export class NewPlacePage { 

    // En attente au cas ou: public navCtrl: NavController, public navParams: NavParams 
     constructor(private placesService: PlacesService, private navCtrl:  NavController) { } 

    onAddPlace(value: {title: string}) { 
    this.placesService.addPlace(value); 
    this.navCtrl.pop(); 
    } 

    onLocateUser() { 
    Geolocation.getCurrentPosition() 
    .then(
    (location) => { 
    console.log('Location fetched successfully') 
    } 
) 

.catch(
    (error) => console.log('An error occured', error) 
    ); 
    } 

    } 

    let watch = this.geolocation.watchPosition(); 
    watch.subscribe((data) => { 
// data can be a set of coordinates, or an error (if an error occurred). 
    // data.coords.latitude 
    // data.coords.longitude 
    }); 

가 여기에 HTML의 내 터미널은 여기 내 새로운 place.ts 파일의 나에게 오류 file: 'file:///Users/emilio/Documents/Workspace/Ionic/my-places/src/pages/new-place/new-place.ts' severity: 'Erreur' message: 'Property 'getCurrentPosition' does not exist on type 'typeof Geolocation'.' at: '24,17' source: 'ts'

을 제공

Answer 1

Geolocation을 생성자에 추가해야합니다. 붙여 넣은 예제에서는 서비스에서 사용하지만 구성 요소에서는 동일합니다. 방금 구성 요소 생성자에 추가했습니다.

import {Injectable} from '@angular/core'; 
import 'rxjs/add/operator/map'; 
import {Geolocation, GeolocationOptions} from '@ionic-native/geolocation'; 
import {LatLng} from '@ionic-native/google-maps' 


@Injectable() 
export class LocationService { 
    geoLocOpts: GeolocationOptions = { 
     maximumAge: 0, 
     enableHighAccuracy: true 
    }; 

    constructor(private geoLocation: Geolocation) { 
    } 

    getLocation(): Promise<LatLng> { 
     return this.geoLocation.getCurrentPosition(this.geoLocOpts) 
      .then(
       geoPos => new LatLng(
        geoPos.coords.latitude, 
        geoPos.coords.longitude 
       ), 
       error => console.log('geoLoc error', error)) 
    } 
}