拖动标记不是令人耳目一新的地址

Question

在流浪代码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>

当标记拖动将显示在控制台日志上时。但是在input item中，它仅显示制造商的第一名，如果我单击input item，它将更改标记提到的最后一个地址或位置。我将input item更改为标签，但无效。

更新1拖动事件：

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);    
    });
    }

Answer 1

您需要 bind 变量的值。您的代码正在设置value属性。

尝试：

<ion-item> <ion-label >Origin</ion-label> <ion-input type="text" [value]="Origin"></ion-input> </ion-item>

检查角模板语法属性绑定

更新：

创建回调函数：

setOriginAddress(data:any){
   this.data = data.results[0].formatted_address;
              console.log(this.data); //Right address
                this.Origin=" ";
                this.Origin=this.data;
}

//为dragevent创建类似的回调而不设置此.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);