我在添加事件监听器给Google Maps Marker时遇到了麻烦。 当我单击任何标记时，它应该将一些信息传递到另一页，但是当我单击任何标记时，我会得到每个标记的重复信息！我如何获得每个标记的信息！
数据Json API
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"properties": {
"data": "METAR",
"id": "URFF",
"site": "Simferopol Intl",
"prior": "0",
"obsTime": "2019-07-16T09:30:00Z",
"temp": 26,
"dewp": 14,
"wspd": 10,
"wdir": 270,
"cover": "SCT",
"visib": 6.21,
"fltcat": "VFR",
"altim": 1008,
"rawOb": "URFF 160930Z 27005MPS 240V320 9999 FEW030CB SCT043 26/14 Q1008 R19/090095 NOSIG",
"rawTaf": "TAF URFF 160753Z 1609/1709 26005G10MPS 9999 BKN015 SCT020CB TEMPO 1609/1618 VRB14MPS 3100 -TSRAGR SCT006 BKN020CB FM161800 16003MPS 3100 BR FEW003 BKN011 SCT030CB"
},
"geometry": {
"type": "Point",
"coordinates": [
33.986,
45.031
]
}
},
{
"type": "Feature",
"properties": {
"data": "METAR",
"id": "UUEE",
"site": "Moscow/Sheremet Arpt",
"prior": "0",
"obsTime": "2019-07-16T09:30:00Z",
"temp": 20,
"dewp": 12,
"wspd": 10,
"wdir": 100,
"cover": "SCT",
"visib": 6.21,
"fltcat": "VFR",
"altim": 1010,
"rawOb": "UUEE 160930Z 10005MPS 9999 SCT034 20/12 Q1010 R06R/CLRD62 R06C/CLRD62 NOSIG",
"rawTaf": "TAF UUEE 160757Z 1609/1709 09003G08MPS 9999 BKN020 TX21/1612Z TN14/1701Z TEMPO 1609/1621 14009G14MPS 3100 -TSRA BKN015CB TEMPO 1621/1704 3100 -SHRA BR FEW003 BKN015CB TEMPO 1704/1709 3100 -SHRA FEW005 BKN015CB"
},
"geometry": {
"type": "Point",
"coordinates": [
37.414,
55.973
]
}
}
]
}
我的代码：
export class WeatherMapsPage implements OnInit {
map: GoogleMap;
protected points: { lng: number, lat: number }[] = [];
latLng: LatLng;
icoa: any;
rawOb: any;
rawTaf: any;
site: any;
obsTime: any;
temp: any;
dewp: any;
wspd: any;
wdir: any;
cover: any;
visib: any;
altim: any;
constructor(public platform: Platform, public http: HTTP, public modalController : ModalController) {
}
-------------- Passing Data to other Page -------
async presentModal(marker) {
const modal = await this.modalController.create({
component: MetarPage,
componentProps:{
Metar: this.rawOb,
TAF: this.rawTaf,
Site:this.site,
Time:this.obsTime,
Temp:this.temp,
WindS:this.wspd,
Winddir:this.wdir,
Dew:this.dewp,
Cover:this.cover,
Visib:this.visib,
Alttim:this.altim
}
});
return await modal.present();
}
async ngOnInit() {
await this.platform.ready();
await this.loadMap()
await this.getData()
}
---- Getting Data from Server -----
async getData() {
this.http.get(this.url, {}, {}).then(data => {
let DataJson = JSON.parse(data.data)
for (let i = 0; i < DataJson.features.length; i++) {
let coords = DataJson.features[i].geometry.coordinates;
this.latLng = new LatLng(coords[1], coords[0]);
this.icoa = DataJson.features[i].properties.id
let fltcat = DataJson.features[i].properties.fltcat
this.rawOb = DataJson.features[i].properties.rawOb
this.rawTaf = DataJson.features[i].properties.rawTaf
this.site = DataJson.features[i].properties.site
this.obsTime = DataJson.features[i].properties.obsTime
this.temp= DataJson.features[i].properties.temp
this.dewp= DataJson.features[i].properties.dewp
this.wspd= DataJson.features[i].properties.wspd
this.wdir= DataJson.features[i].properties.wdir
this.cover= DataJson.features[i].properties.cover
this.visib= DataJson.features[i].properties.visib
this.altim= DataJson.features[i].properties.altim
let icons = '{}'
switch (fltcat) {
case "VFR":
icons = "./assets/icon/VFR.png"
break;
case "MVFR":
icons = "./assets/icon/MVFR.png"
break;
case "IFR":
icons = "./assets/icon/IFR.png"
break;
case "LIFR":
icons = "./assets/icon/LIFR.png"
return './assets/icon/1.png'
}
let marker: Marker = this.map.addMarkerSync({
position: this.latLng,
title: this.site,
icon: icons
})
marker.on(GoogleMapsEvent.MARKER_CLICK).subscribe(marker=> {
this.presentModal(marker)
});
}
})
}
}