web-dev-qa-db-ja.com

ionicジオロケーションプラグインエラー：「ジオロケーションのプロバイダーがありません」

Ionic2 hello worldプロジェクトで位置情報を使用しようとしています。そして、 公式サイト の指示に従ってionic plugin "Geolocation"を追加します。

次の2つのコマンドを実行しました。

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

そして、これは私のhome.tsです：

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
      });

  }

}

ただし、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

最初はブラウザでデバッグしていたからだと思っていましたが、その後、Android電話で同じエラーが発生しました。

「ジオロケーションのプロバイダーなし」とはどういう意味ですか？また、ionic2プロジェクトでジオロケーションを使用するにはどうすればよいですか？

どうもありがとう！

angulartypescriptionic2cordova-plugins
21
awmleer

プロバイダーをNgModuleに追加する必要があります。つまり、プロバイダーの下のmodule.ts、

providers: [
  Geolocation
]
50
Sajeetharan

Geolocationクラスをインポートし、app.module.tsファイル内のプロバイダーのリストに追加する必要があります

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

providers: [
     Geolocation
]
5
Elkin Urango

私は同じ問題を抱えており、ネイティブのコアプラグインがpackage.jsonと同じバージョンではなかったということに直面しています。

このソリューションおよびこの他の記事については、以下で確認できます。

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

それは私のために働いた、私はそれをどこにでもインポートしたが、app.module.ts app.module.tsのプロバイダーに追加するのを忘れていた

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

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

次に、このインスタンスではテストホームとして緯度と経度を表示していました。

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);
 });

その後、home.html {{lat}} {{longt}}で

私はそれが簡単なだけだったことを知っていますが、マップに配置する前にデータを取り出していました。

0
Stu

Ionic 4の場合、app.module.ts 上：

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

そして、一番下のProviders配列の中に、Geolocationを追加します：

providers: [
    Geolocation,
    ...
]
0
Grant