ionic2イオンネイティブとコルドバ・プラグイン・ジャイロスコープの誤差

Question

私はionic2のアプリを持っていると私は、このtutorielようなイオン性ネイティブとコルドバ・プラグイン・ジャイロスコープとジャイロスコープを使用したい：

https://ionicframework.com/docs/native/gyroscope/

しかし、私はこれを持っていますエラー

ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'watch' of undefined 
TypeError: Cannot read property 'watch' of undefined 
    at Observable._subscribe 

...

import { Component } from '@angular/core'; 
import { NavController } from 'ionic-angular'; 
import { Gyroscope, GyroscopeOrientation, GyroscopeOptions } from '@ionic-native/gyroscope'; 

import { Platform } from 'ionic-angular'; 
import {geoCompassService} from '../../services/geocompass' 
import * as Leaflet from "leaflet"; 

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

    pointGps:any; 
    angle:any; 
    distance:any; 
    orientation:any; 

    constructor(private platform: Platform, 
       public navCtrl: NavController, 
       public _geoCompassService:geoCompassService, 
       private gyroscope: Gyroscope) { 

     platform.ready().then(() => { 
     console.log("platform ready !!!"); 
      this.pointGps=this._geoCompassService.getPointGps(); 
      this.angle = (Math.atan2(0,1) - Math.atan2((this.pointGps.coordB.lng - this.pointGps.coordA.lng),             (this.pointGps.coordB.lat - this.pointGps.coordA.lat)))*180/Math.PI+180;  
      this.distance = Leaflet.latLng(this.pointGps.coordA).distanceTo(this.pointGps.coordB); 




      //Gyro 
      let options: GyroscopeOptions = { 
      frequency: 1000 
      }; 

      this.gyroscope.getCurrent(options) 
         .then((orientation: GyroscopeOrientation) => { 
       this.orientation=orientation 
       console.log("orientation "+this.orientation.x) 
      }) 
      .catch() 

      this.gyroscope.watch() 
          .subscribe((orientation: GyroscopeOrientation) => { 
       this.orientation=orientation 
      }); 


     }); 

    } 

} 

あなたがすることはできませんhelp me

Answer 1

このプラグインは、エミュレータまたは実際のデバイスの代わりにブラウザを使用していることを示すエラーが表示されている場合、実際のハードウェアでのみ機能します。

import { Component } from '@angular/core'; 
import { Gyroscope, GyroscopeOrientation, GyroscopeOptions } from '@ionic-native/gyroscope'; 
import {Platform} from "ionic-angular"; 

@Component({ 
    selector: 'off-gyroscope', 
    templateUrl: 'gyroscope.html' 
}) 
export class GyroscopeComponent { 

    options: GyroscopeOptions = { 
    frequency: 100 
    }; 
    orientation: GyroscopeOrientation; 
    x: string; 
    y: string; 
    z: string; 

    constructor(public plt: Platform, private gyroscope: Gyroscope) { 
    plt.ready().then((readySource) => { 

     if (readySource == 'cordova') { 
     this.gyroscope.watch(this.options) 
      .subscribe((orientation: GyroscopeOrientation) => { 
      this.orientation = orientation; 
      this.x = orientation.x.toString(); 
      this.y = orientation.y.toString(); 
      this.z = orientation.z.toString(); 
      }); 
     } 
     else { 
     this.x = 'Not a real device'; 
     this.y = 'Not a real device'; 
     this.z = 'Not a real device'; 
     } 
    }); 
    } 
} 

決定的な事はdom（ブラウザ）またはcordova（エミュレータ/デバイス）のいずれかをチェックreadySourceです。

「ハードウェア」プラグインを処理する方法については、初心者のための明確なヒントはありません。 ブラウザで使用しているアプリで画像を見てください。

App in the browser