ionic2离子本地和科尔多瓦-插件陀螺仪误差(ionic2 ionic native and co

我有一个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
          });


      });

  }

}

你能不能帮我

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

关键的是readySource对于任一检查dom （浏览器）或cordova （仿真器/装置）。

不幸的是文档中缺少明确的提示初学者如何处理“硬件”插件。 看看在浏览器中使用的应用程序中的图像。

应用程序在浏览器

文章来源: ionic2 ionic native and cordova-plugin-gyroscope error