在Ionic 2中实现GoogleMap.OnInfoWindowClickListener

ionic cordova plugin add cordova-plugin-googlemaps --variable API_KEY="YOUR_API_KEY"

ionic generate page google-maps

import { Component, OnInit } from '@angular/core';
import { GoogleMaps, GoogleMap, GoogleMapsEvent } from '@ionic-native/google-maps';

@Component({
  selector: 'app-google-maps',
  templateUrl: './google-maps.page.html',
  styleUrls: ['./google-maps.page.scss'],
})
export class GoogleMapsPage implements OnInit {
  map: GoogleMap;

  constructor(private googleMaps: GoogleMaps) { }

  ngOnInit() {
    this.loadMap();
  }

  loadMap() {
    this.map = this.googleMaps.create('map_canvas');
    this.map.one(GoogleMapsEvent.MAP_READY).then(() => {
      console.log('Map is ready!');
    });
  }
}

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

@Component({
  selector: 'app-google-maps',
  templateUrl: './google-maps.page.html',
  styleUrls: ['./google-maps.page.scss'],
})
export class GoogleMapsPage implements OnInit {
  map: GoogleMap;

  constructor(private googleMaps: GoogleMaps) { }

  ngOnInit() {
    this.loadMap();
  }

  loadMap() {
    this.map = this.googleMaps.create('map_canvas');
    this.map.one(GoogleMapsEvent.MAP_READY).then(() => {
      console.log('Map is ready!');
      this.addMarker();
    });
  }

  addMarker() {
    const markerOptions: MarkerOptions = {
      position: { lat: 37.7749, lng: -122.4194 },
      title: 'San Francisco'
    };

    this.map.addMarker(markerOptions).then((marker: Marker) => {
      marker.showInfoWindow();
      marker.on(GoogleMapsEvent.INFO_CLICK).subscribe(() => {
        console.log('Info window clicked!');
      });
    });
  }
}

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { GoogleMapsPage } from './google-maps/google-maps.page';

const routes: Routes = [
  {
    path: 'google-maps',
    component: GoogleMapsPage
  }
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }