Google maps Typescript错误找不到名称‘；谷歌&x2019；

如果我将文件保存两次运行，但不知道为什么 google.maps.ts

ngOnInit(){
    this.initMap();
}

initMap(){
    let coords = new google.maps.LatLng(37.992667,-1.1146491);
    let mapOptions: google.maps.MapOtpions= {
        center: coords,
        zoom: 17,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    this.map = new google.maps.Map(this.mapElement.nativeElement,
    mapOptions)


}

}

这是错误代码

Typescript: C:/ionic/restaurante/IESAljada/src/components/google-map/google-map.ts, line: 22

  L21:  initMap(){
  L22:      let coords = new google.maps.LatLng(37.992667,-1.1146491);
  L23:      let mapOptions: google.maps.MapOtpions= {

---

google.maps.MapOtpions

看起来像是打字错误。你是说？

试试这个基本的例子。申报

谷歌公司

在typescript文件中。如下所示：

declare var google;

@Component( {
    selector: 'page-example',
    templateUrl: 'example.html'
} )
export class GoogleMapExample {
    @ViewChild( 'map' ) mapElement: ElementRef;
    map: any;
    private defaultLat = 56.1304;
    private defaultLng = 106.3468;

    ionViewDidLoad() {
        this.loadMap();
    }

    private loadMap = () =>{
        let latLng = new google.maps.LatLng( this.defaultLat, this.defaultLng );
        console.log("latLng====>",latLng);
        let mapOptions = {
            center: latLng,
            zoom: 15,
            disableDefaultUI: true
        }
        this.map = new google.maps.Map( this.mapElement.nativeElement, mapOptions );
    }
}

---

HTML将是：

请尝试文档中的示例代码

装置

$> ionic cordova plugin add cordova-plugin-googlemaps \
  --variable API_KEY_FOR_ANDROID="(API_KEY_FOR_ANDROID)" \
  --variable API_KEY_FOR_IOS="(API_KEY_FOR_IOS)"

$> npm install --save @ionic-native/core@latest @ionic-native/google-maps@latest

代码

---

是的，但问题仍然存在，现在我正在使用一个带有windows的按钮；我只是注意到我使用的是离子型，而不是离子型——v2。这可能是个问题吗？这是我启动项目的方式：ionic start helloWorld blank我读到这样创建ionic 3项目如果您最近安装了ionic，它将创建一个最新版本的项目。只需使用ionic--v或ionic-version检查ionic版本

import {
  GoogleMaps,
  GoogleMap,
  GoogleMapsEvent,
  GoogleMapOptions,
  CameraPosition,
  MarkerOptions,
  Marker
} from '@ionic-native/google-maps';
import { Component } from "@angular/core/";

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

  ionViewDidLoad() {
    this.loadMap();
  }

  loadMap() {

    let mapOptions: GoogleMapOptions = {
      camera: {
         target: {
           lat: 43.0741904,
           lng: -89.3809802
         },
         zoom: 18,
         tilt: 30
       }
    };

    this.map = GoogleMaps.create('map_canvas', mapOptions);

    let marker: Marker = this.map.addMarkerSync({
      title: 'Ionic',
      icon: 'blue',
      animation: 'DROP',
      position: {
        lat: 43.0741904,
        lng: -89.3809802
      }
    });
    marker.on(GoogleMapsEvent.MARKER_CLICK).subscribe(() => {
      alert('clicked');
    });
  }
}