hello
am trying to implement autocomplete service, but unable to do so,
when I test the app on the browser, i got
ReferenceError: google is not defined
when i test it on a device, the page doesn’t appear, so i searched over the internet, and there were a lot of people suggesting to use platform.ready(), i used it i was able to get into the page, but it didn’t work as expected. here is my code:
import { Component, NgZone } from '@angular/core';
import { IonicPage, NavController, NavParams, ViewController,Platform } from 'ionic-angular';
declare var google;
@IonicPage()
@Component({
selector: 'page-auto-complete',
templateUrl: 'auto-complete.html',
})
export class AutoCompletePage {
autocompleteItems;
autocomplete;
ctr: HTMLElement = document.getElementById("q");
service:any = new google.maps.places.AutocompleteService();
geocoder:any = new google.maps.Geocoder();
constructor(private platform:Platform,public viewCtrl: ViewController, private zone: NgZone) {
this.autocompleteItems = [];
this.autocomplete = {
query: ''
};
//this is a solution i came up with to be able to get into the page.
// this.platform.ready().then(data=>{
// this.service = new google.maps.places.AutocompleteService(this.ctr);
// this.geocoder = new google.maps.Geocoder();
// })
}
dismiss() {
this.viewCtrl.dismiss();
}
chooseItem(item: any) {
this.geocoder.geocode({
'placeId': item.place_id
}, (responses) => {
// send the place name
// & latlng back
this.viewCtrl.dismiss({
description: item.description,
latitude: responses[0].geometry.location.lat(),
longitude: responses[0].geometry.location.lng()
});
});
}
updateSearch() {
if (this.autocomplete.query == '') {
this.autocompleteItems = [];
return;
}
let that = this;
this.service.getPlacePredictions({
input: that.autocomplete.query,
componentRestrictions: {
country: 'BH'
}
}, (predictions, status) => {
that.autocompleteItems = [];
that.zone.run(function () {
predictions = predictions || [];
predictions.forEach(function (prediction) {
that.autocompleteItems.push(prediction);
});
});
});
}
}
Some info :
hopefully i get some answers