IONIC 2 谷歌地图标记点击事件 [英] IONIC 2 Google Maps Marker Click Event

问题描述

我正在尝试使用此代码从数据库中获取所有标记.但问题是当我单击标记时，我总是从数据库中获取最后一项.当alert(record.id);"弹出它总是显示每个标记的最后一项.我想在单击它们时显示每个标记的 id.

I'm trying to get all the markers from the database with this code. But the problem is when I click the marker I always get the last item from the database. When the "alert(record.id);" pops up it always show the last item for every marker. I want to show the id of each marker when I click them.

loadMarker(){
this.service.getMaps()
      .subscribe( data1 => {
        let loc = data1;
             for (var i = 0; i < data1.length; i++) {
                 var record = data1[i];
        let latlng = new GoogleMapsLatLng(record.lat, record.lng);
        let markerOptions: GoogleMapsMarkerOptions = {
        'position': latlng,
        'title': record.title,
        'animation': GoogleMapsAnimation.DROP
        };


        this.map.addMarker(markerOptions).then((marker: GoogleMapsMarker) => {
         marker.addEventListener(GoogleMapsEvent.MARKER_CLICK)
        .subscribe(() => {
          alert(record.id);
               });
          });       
}

推荐答案

订阅事件是异步的，你不会从 for 循环中获取 record.id.但是你可以在 subscribe 中访问 markerOptions 数据.

Subscribe event is asynchronous.You will not get record.id from the for loop. But you can access markerOptions data in subscribe.

查看这里

    this.map.addMarker(markerOptions).then((marker: GoogleMapsMarker) => {
             marker.addEventListener(GoogleMapsEvent.MARKER_CLICK)
            .subscribe(e => {
              alert(e.get('title'));
let rec = data1.filter(v=>v.title==e.get('title'));
alert(rec[0].id);
                   });
              });

这里

这篇关于IONIC 2 谷歌地图标记点击事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！