我已在信息窗口内容内的按钮上添加了click事件。但是,即使不单击按钮,在单击事件之后应运行的代码也会执行。加载地图后,会自动执行console.log(“ Hi”)click事件代码。我不知道到底是什么触发了按钮的单击事件。
getPostsForMarker(defaultlat, defaultlng) {
this.searchService.getAllPostForMarker(defaultlat, defaultlng).subscribe(
data => {
this.postMarker = data;
var resultArray = [];
for (let i = 0; i < this.postMarker.length; i++) {
console.log(this.postMarker[i]);
console.log(this.postMarker[i].Latitude);
this.locations = [
resultArray[i] = { lat: this.postMarker[i].Latitude, lng: this.postMarker[i].Longitude }
]
}
console.log(resultArray);
console.log("Zoom map to");
console.log(resultArray[0]);
const options = {
center: resultArray[0],
zoom: 12
}
this.map = new google.maps.Map(this.mapRef.nativeElement, options);
//to add marker in the map
var marker = [];
for (let i = 0; i < resultArray.length; i++) {
marker[i] = new google.maps.Marker({
position: resultArray[i],
map: this.map
});
//to add info window
marker[i].addListener('click', (event) => {
infowindow[i].open(this.map, marker[i])
})
}
// contents to display in info window
var contentString = [];
for (let i = 0; i < this.postMarker.length; i++) {
contentString[i] =
'<b>Space Type:</b> ' + this.postMarker[i].Space.SpaceTypeName +
'<br><b>Address:</b> ' + this.postMarker[i].Address +
'<br><b>Purpose:</b> ' + this.postMarker[i].Suitable.SuitableForType +
'<br><b>Price: </b>' + this.postMarker[i].Price +
'<br><strong>No of available rooms: </strong>' + this.postMarker[i].NoOfRooms +
'<br>' +
'<input type="button" value="View Details" id="detailbtn" onclick="'+console.log("Hi")+'"/>'
;
}
//to add info window in the map
var infowindow = [];
for (let i = 0; i < this.postMarker.length; i++) {
infowindow[i] = new google.maps.InfoWindow({
content: contentString[i]
});
}
});
}