暂停代码Getaddress
函数将在标记dragend
事件发生时调用
Getaddress(LastLat, LastLng , marker,source){
this.http.get('https://maps.googleapis.com/maps/api/geocode/json?latlng='+LastLat+ ','+LastLng )
.map(res => res.json())
.subscribe(data => {
console.log(this.data); //json output
this.data = data.results[0].formatted_address;
console.log(this.data); //Right address
this.Origin=" ";
this.Origin=this.data;
}
});
并在html中:
<ion-item> <ion-label >Origin</ion-label> <ion-input type="text" value={{Origin}}></ion-input> </ion-item>
标记dragend右侧地址将显示在控制台日志中。但是在input item
中它只显示制造商的第一名,如果我点击input item
,它将更改标记提及的最后地址或位置。我将input item
更改为Label,但它无效。
更新1 dragend事件:
lastLatLng(marker,source){
google.maps.event.addListener(marker, 'dragend', () =>{
this.LastLat= marker.position.lat();
this.LastLng= marker.position.lng();
this.Getaddress(this.LastLat,this.LastLng, marker,source);
});
}
答案 0 :(得分:1)
您需要绑定该变量的值。您的代码正在设置value
属性。
尝试:
<ion-item> <ion-label >Origin</ion-label> <ion-input type="text" [value]="Origin"></ion-input> </ion-item>
检查Angular模板语法property binding
更新:
创建回调函数:
setOriginAddress(data:any){
this.data = data.results[0].formatted_address;
console.log(this.data); //Right address
this.Origin=" ";
this.Origin=this.data;
}
//为dragevent创建一个类似的回调,而不设置this.Origin。
lastLatLng(marker,source){
google.maps.event.addListener(marker, 'dragend', () =>{
this.LastLat= marker.position.lat();
this.LastLng= marker.position.lng();
this.Getaddress(this.LastLat,this.LastLng, marker,source,this.setOriginAddress.bind(this));
});
}
的getAddress
Getaddress(LastLat, LastLng , marker,source,callbackFn){
this.http.get('https://maps.googleapis.com/maps/api/geocode/json?latlng='+LastLat+ ','+LastLng )
.map(res => res.json())
.subscribe(callbackFn);