获取ionic2中的当前位置 [英] Get current position in ionic2

问题描述

我是Ionic 2的新手并且接受了一些教程。

I am new to Ionic 2 and following some tutorials.

在这种情况下，我需要更改以下方法：

In this case I need to change following method:

 applyHaversine(locations){

        let usersLocation = {


            lat: 40.713744, 
            lng: -74.009056
        };

        locations.map((location) => {

            let placeLocation = {
                lat: location.latitude,
                lng: location.longitude
            };

            location.distance = this.getDistanceBetweenPoints(
                usersLocation,
                placeLocation,
                'miles'
            ).toFixed(2);
        });

        return locations;
    }

您可以看到变量usersLocation是硬编码的：

You can see that variable usersLocation is hard-coded:

let usersLocation = {


            lat: 40.713744, 
            lng: -74.009056
        };

我想到达真正的用户位置。

I would like to get there the real user location.

我见过Geolocation.getCurrentPosition（）方法，但在这种情况下我不知道如何实现它。

I have seen the method Geolocation.getCurrentPosition(), but I don´t know how to implement it in this case.

谢谢

EDITED

 applyHaversine(locations){
        Geolocation.getCurrentPosition().then((resp) => {

        let  latitud = resp.coords.latitude
        let longitud = resp.coords.longitude
        }).catch((error) => {
          console.log('Error getting location', error);
        });

  console.log(this.latitud);
        let usersLocation = {

           lat:  this.latitud, 
           lng:  this.longitud 
        };

推荐答案

我会使用Geolocation cordova插件。您可以使用 ionic-native 访问它。首先你需要安装插件：

I would use the Geolocation cordova plugin. You can access it with ionic-native. First you need to install the plugin:

$ ionic plugin add cordova-plugin-geolocation --save

然后您可以像这样使用它：

You can then use it like this:

import { Geolocation } from 'ionic-native';

Geolocation.getCurrentPosition().then(res => {
  // res.coords.latitude
  // res.coords.longitude
}).catch((error) => {
  console.log('Error getting location', error);
});

https://ionicframework.com/docs/v2/native/geolocation/

编辑：

您的更新代码几乎是正确的。您在代码中犯了2个小错误：

Your updated code is almost correct. You made 2 small mistakes in your code:

1. 您定义了2个局部变量（ let latitud 和让纵向），但稍后在您的代码中，您可以使用 this.latitud 访问它们和 this.longitud 。 此始终引用您的类中定义的变量，因此这些变量将是未定义的。您必须使用局部变量或类范围变量，但这取决于您的体系结构。两者都有效。

1. You defined 2 local variables (let latitud and let longitud), but then later in your code you access them by using this.latitudand this.longitud. this always refers to variables defined in your class, so those will be undefined. You either have to use local variables or class wide variables, but that depends on your architecture. Both work.

Geolocation.getCurrentPosition（）返回一个承诺。这意味着 .then（（）=> {}）中的代码将在稍后执行（只要插件具有您的位置的结果）。但是其余代码在之后之外，这意味着它将在您拥有该位置之前执行。因此，您需要将整个代码复制到然后，如下所示：

Geolocation.getCurrentPosition() returns a promise. This means that the code inside .then(() => {}) will be executed later (as soon as the plugin has the result with your location). But the rest of your code is outside the then, which means that it will be executed before you have the location. So you need to copy your whole code into the then like this:

applyHaversine(locations) {
  Geolocation.getCurrentPosition().then(res => {
    let usersLocation = {
      lat: res.coords.latitude, 
      lng: res.coords.longitude
    };

    locations.map((location) => {

      let placeLocation = {
        lat: location.latitude,
        lng: location.longitude
      };

      location.distance = this.getDistanceBetweenPoints(
        usersLocation,
        placeLocation,
        'miles'
      ).toFixed(2);
    });

  console.log(locations); // This will now have your updated distances

  }).catch((error) => {
    console.log('Error getting location', error);
  });

  return locations; // this will not work because the code above is asynchronous
}

编辑2：

一个有效的例子是：

applyHaversine(locations) {
  return new Promise((resolve, reject) => {
    Geolocation.getCurrentPosition().then(res => {
      let usersLocation = {
        lat: res.coords.latitude, 
        lng: res.coords.longitude
      };

      locations.map((location) => {

        let placeLocation = {
          lat: location.latitude,
          lng: location.longitude
        };

        location.distance = this.getDistanceBetweenPoints(
          usersLocation,
          placeLocation,
          'miles'
        ).toFixed(2);
      });

    resolve(locations); // As soon as this is called, the "then" in will be executed in the function below.

    }).catch(reject);
  });
}

使用此功能的地方：

doSomething(locations) {
  this.applyHaversine(locations).then(res => {
    // The logic after you have your new results goes here.
    console.log(res); // res will be the value that you passed into the resolve function above, in this case your updated locations array
  }
}

这篇关于获取ionic2中的当前位置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！