2016-12-01 10 views
0

Googleマップのアドレス自動完成結果をドロップダウンから選択すると、それは私の親コンポーネントに渡されませんが、手動でアドレスを入力するとします。オートコンプリートドロップダウン入力選択がngModelChangeをトリガーしない

私は入力を開始し、情報を渡します。アドレスを選択すると、入力ボックスに表示されているにもかかわらず、残りのデータが入力されますが、データは渡されません。

私はGoogleマップのdivでアドレスを取得する(子テンプレートで)この入力を使用しています:私の親テンプレートで

@Component({ 
    selector: 'gmap', 
}) 

export class gMap{ 
    @Input() address; 
    @Output() addressChange = new EventEmitter(); 
} 

私の子コンポーネントで

<input 
    [(ngModel)]="address" 
    (ngModelChange)="addressChange.emit($event)" 
    id="pac-input" 
    name='address' 
    class="mapControls" 
    type="text" 
    placeholder="Enter Address" 
> 

<gmap [(address)]="address"></gmap> 

と親成分:

address: string; 

もちろん、もっとコードがありますが、これは私が考える重要なものです。誰もがそれを作る方法を知っているので、ドロップダウンからオートコンプリートの結果を選択すると、選択したデータでngModelChangeがトリガーされます。我々はtypescriptですを使用しているので、私は、これらの機能の下で、その後、

() => 

に、Googleのすべての

function() 

のを変えそう

答えて

1

が、私は一種のそれを固定し、私はこれをしませんでしたGoogleマップコードの

searchBox.addListener('place_changed',() => { 
    places.forEach((place) => { 

私は時々20秒のように、エミッタ

巨大な遅延があります
this.addressChange.emit(place.formatted_address); 

と呼ばれるが、それは動作します!

私がドロップダウンから選択してエミッタがオフになるまでの間に数秒の遅延があるのは誰でも知っていますか?私は実際にその遅れを取り除きたいです

あなたが約束オブジェクトを使うなら、応答は非常に速くなります。

return new Promise((resolve, reject) =>{ 
    autocomplete.addListener('place_changed',() => { 
    var place = autocomplete.getPlace(); 
    console.log("place "+place); 
    resolve(place); 
    }); 
}) 
関連する問題