I looked for an information for several weeks. First, I'm using AngularJS 1.6 and ngMap module.
Here's what I'm doing:
I'm using a search box (with ngMap
autocomplete) in my Homepage:
import htmlTemplate from './searchBox.html';
export default {
template: htmlTemplate,
require: {
parent: '^home'
},
controller: function controller(MapsService, $log) {
'ngInject';
const self = this;
this.$onInit = () => {
$log.info('searchBox component init');
MapsService.loadGoogleApi().then(() => {
this.loaded = true;
this.onPlaceChanged = function onPlaceChanged() {
const place = this.getPlace();
if (place.geometry) {
self.activity.lat = place.geometry.location.lat();
self.activity.lng = place.geometry.location.lng();
}
};
});
Also, I'm using a component which shows activities. When I create an activity via my form, I fill an address field which uses autocomplete.
<div class="input-field col s12">
<i class="material-icons prefix">location_on</i>
<input ng-if="$ctrl.loaded" places-auto-complete ng-model="$ctrl.activity.address" id="icon_prefix" type="text" on-place-changed="$ctrl.onPlaceChanged()"
class="validate">
<label for="icon_prefix">{{'ANNOUNCE.ADDRESS' | translate}}
</label>
I specified that addresses are converted in latitude / longitude.
MapsService.loadGoogleApi().then(() => {
this.loaded = true;
this.onPlaceChanged = function onPlaceChanged() {
const place = this.getPlace();
if (place.geometry) {
self.activity.lat = place.geometry.location.lat();
self.activity.lng = place.geometry.location.lng();
}
};
});
My question is:
How to show activities (by city) by making coincide the address of my search box and the address of my form?
Thanks a lot !
So... I finded my answer. It's necessary to add a stored procedure into the database and create a function which will allow to get back the data.