0
私は、ユーザーがアドレスを書き留め、Google Maps APIのドロップダウンから特定の値をクリックし、彼/彼女が保存できる他のギャップを埋めると、可能な最も単純なオートコンプリート入力を作成しようとしています反応的なフォームonClick角度4 Google Maps APIフォームコントロールの更新の問題
しかし、私はFormControlに適切な値を注入できません。ユーザーが「Washi」を書き込んで「Washington D.C」をクリックすると、入力に表示される値は正しいですが、フォームを保存すると、Firebaseデータベースで 'Washington D.C'の代わりに 'Washi'が取得されます。ここに私のコードは次のとおりです。
<input id="address" type="text" class="form-control" formControlName="address" />
そしてxxxxx.component.ts中：
ngAfterViewInit(){
let input = <HTMLInputElement>document.getElementById("address");
this.mapsAPILoader.load().then(
() => {
let autocomplete = new google.maps.places.Autocomplete(input, {types: ['address']});
autocomplete.addListener('place_changed',() => {
const place = autocomplete.getPlace();
this.ngZone.run(() => {
this.cd.detectChanges();
this.myGroup.value.address = place.formatted_address;
console.log(this.myGroup.value.address);
});
});
}
);}
反応型はのOnInit、すべてをロードされ正常に動作しているようです。 Console.logには適切な値が表示されますが、データベースに転送される値は表示されません。保存機能は次のとおりです。
save(myGroup: NgForm){
this.user = this._firebaseAuth.authState;
this.user.subscribe(
(user) => {
if (user) {
this.userDetails = user;
this.first.subscribe(snapshot => {
if (snapshot.exists() === false) {
firebase.database().ref('path').set({
record: this.myGroup.value
});
} else {
this.userDetails = null;
}
}
);
}
}
);
}
アイデアはありますか？