web-dev-qa-db-fra.com

ionic erreur du plugin de géolocalisation: "Aucun fournisseur pour la géolocalisation"

J'essaie d'utiliser la géolocalisation dans mon projet ionic2 hello world, et j'ajoute le plugin ionic "Géolocalisation") en suivant les instructions du site officiel .

J'ai exécuté ces deux commandes:

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

Et voici ma maison.

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

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
  map:any=null;
  geoInfo:any={
      resp:'',
      data:''
  };

  constructor(
      public navCtrl: NavController,
      private geolocation: Geolocation
  ) {

  }

  test(){
      this.geolocation.getCurrentPosition().then((resp) => {
          this.geoInfo.resp=JSON.stringify(resp);
          // resp.coords.latitude
          // resp.coords.longitude
      }).catch((error) => {
          console.log('Error getting location', error);
          this.geoInfo.resp='Error getting location';
      });

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

  }

}

Cependant, j'ai eu l'erreur suivante dans la console de mon chrome:

EXCEPTION: Error in ./TabsPage class TabsPage - inline template:0:0 caused by: No provider for Geolocation!
error_handler.js:56ORIGINAL EXCEPTION: No provider for Geolocation!

screenshot

Au début, je pensais que c’était parce que je déboguais dans le navigateur, mais j’ai eu alors la même erreur dans mon Android.

Alors, que signifie "Aucun fournisseur de géolocalisation" et comment dois-je utiliser la géolocalisation dans mon projet ionic2?

Merci beaucoup!

21
awmleer

Vous devez ajouter le fournisseur au NgModule, c'est-à-dire module.ts sous fournisseurs,

providers: [
  Geolocation
]
50
Sajeetharan

Vous devez importer la classe Geolocation et l'ajouter à votre liste de fournisseurs dans le fichier app.module.ts.

import { Geolocation } from '@ionic-native/geolocation';

providers: [
     Geolocation
]
5
Elkin Urango

J'ai eu le même problème et je me rends compte que mes plugins de base natifs n'étaient pas dans les mêmes versions dans mon package.json.

Vous pouvez vérifier cette solution et cet autre article aux adresses suivantes:

https://forum.ionicframework.com/t/cant-resolve-peer-dependencies-after-update/107224/2https://blog.ionicframework.com/help- test-ionic-native-5 /

https://ionicframework.com/docs/native

0
Roberto N

cela a fonctionné pour moi, je l'avais importé partout mais j'avais oublié de l'ajouter aux fournisseurs sur app.module.ts app.module.ts

import { Geolocation } from '@ionic-native/geolocation';

providers: [
StatusBar,
SplashScreen,
{provide: ErrorHandler, useClass: IonicErrorHandler},
AuthService,
EmailValidator,
DataService,
Geolocation
]

puis sur la page, je montrais le lat et long à dans ce cas comme un test à domicile;

import { Geolocation } from '@ionic-native/geolocation';
lat: number;
longt: number;

this.geolocation.getCurrentPosition().then((resp) => {
  this.lat = (resp.coords.latitude);
  this.longt =(resp.coords.longitude);
 }).catch((error) => {
   console.log('Error getting location', error);
 });

puis sur home.html {{lat}} {{longt}}

Je sais que ce n’était que simple, mais j’étais en train de récupérer les données avant de les placer dans la carte.

0
Stu

Pour Ionic 4 vous ajoutez à app.module.ts Haut:

import { Geolocation } from '@ionic-native/geolocation/ngx';

Et en bas, à l'intérieur du tableau Providers, ajoutez Geolocation:

providers: [
    Geolocation,
    ...
]
0
Grant