【问题标题】:Ionic Native tried accessing the GoogleMaps plugin but it's not installedIonic Native 尝试访问 GoogleMaps 插件,但未安装
【发布时间】:2017-10-28 08:25:45
【问题描述】:

我目前正在尝试通过 ionic 实现 GoogleMaps。我是一个初学者,所以请小心!我收到一个错误:

console.warn: Native: tried accessing the GoogleMaps plugin but it's not installed. 

每当我跑步时

ionic cordova build ios
ionic cordova emulate ios -lc

我在home.ts 中的代码如下所示:

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

import { GoogleMaps, GoogleMap, GoogleMapsEvent, LatLng } from '@ionic-native/google-maps';


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

  map: GoogleMap;

  constructor(public navCtrl: NavController, public geolocation: Geolocation, private googleMaps: GoogleMaps) {
    console.log("Home page creator loaded");
  }

  ngAfterViewInit() {
    console.log("ngAfterViewInit loaded");

    let mapEle = document.getElementById('map');
    let location = new LatLng(-34.9290,138.6010);
    let mapOpt = {
      center: {lat: -34.397, lng: 150.644},
      zoom: 8,
    };

    this.map = this.googleMaps.create(mapEle, mapOpt);
    this.map.one(GoogleMapsEvent.MAP_READY).then(() => {
      console.log("Map seems ready!");
    });
  }
}

主要适应离子原生 GoogleMaps 教程的建议。我已经重复卸载并再次安装了 ionic-native google-maps plugin,但它似乎不起作用。知道我可能做错了什么吗?

【问题讨论】:

  • @DaveTheAI 您是否按照此处指定的方式将插件添加到应用模块 - ionicframework.com/docs/native/#Add_Plugins_to_Your_App_Module
  • @Gandhi,是的,我做到了...我的 app.module.ts 包括: import { GoogleMaps, GoogleMap } from '@ionic-native/google-maps'; ...提供者:[ ... GoogleMaps,GoogleMap,...] ...
  • @Gandhi 我不是 Ionic 方面的专家,因为我没有动手。但据我所知,应该在平台就绪事件中调用插件代码.. 是否注意?
  • 您是否在使用 ionic preview 应用来测试您的应用?
  • @Gandhi,您的意思是从platform.ready().then(() => {...} 中调用代码吗?

标签: ios cordova google-maps ionic-framework ionic2


【解决方案1】:
ngAfterViewInit() {
  this.platform.ready().then(() => {
    this.loadMap();
  });
}

【讨论】:

  • 虽然这段代码 sn-p 可以解决问题,但including an explanation 确实有助于提高帖子的质量。请记住,您是在为将来的读者回答问题,而这些人可能不知道您提出代码建议的原因。
猜你喜欢
  • 2018-04-24
  • 1970-01-01
  • 2020-10-16
  • 1970-01-01
  • 2018-06-03
  • 1970-01-01
  • 1970-01-01
  • 2021-11-10
  • 2018-03-02
相关资源
最近更新 更多