Let me explain briefly what I do want. I have module that contains 2 pages. One is for creating new company and the other one is for preview company info + edit that company info.
Everything works fine. Now when I click in my table one of those companies, it opens "edit/IDOFORGANIZATIONHERE" and it displays all of the information for the clicked organization(company).
Now I need to implement feature for google map to display company's location based on company's address,city,postal code and country.
I have implemented Google Maps successfully.
this.gMapsService.getLatLan('London' )
.subscribe(
result => {
this.__zone.run(() => {
this.lat = result.lat();
this.lng = result.lng();
})
},
error => console.log(error),
() => console.log('Geocoding completed!')
);
In my gMapsService I have following
import { Injectable, NgZone } from '@angular/core';
import { GoogleMapsAPIWrapper } from '@agm/core';
import { MapsAPILoader } from '@agm/core';
import { Observable, Observer } from 'rxjs';
import {} from '@types/googlemaps';
declare var google: any;
@Injectable()
export class GMapsService extends GoogleMapsAPIWrapper{
constructor(private __loader: MapsAPILoader, private __zone: NgZone) {
super(__loader, __zone);
}
getLatLan(address) {
console.log('Getting Address - ', address);
let geocoder = new google.maps.Geocoder();
return Observable.create(observer => {
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
observer.next(results[0].geometry.location);
observer.complete();
} else {
console.log('Error - ', results, ' & Status - ', status);
observer.next({});
observer.complete();
}
});
})
}
}
Now if you take a look at the first snippet its gonna display google map with London city being centered and this also works perfectly.
Now I want to change this string London to be value of company's info such as
organization.address
organization.city
organization.postalcode
organization.countryname
If I write it like this this.gMapsService.getLatLan(this.address) or this.gMapsService.getLatLan(organization.address) code successfully compiles but in my console I can see that Address that is being passed is "undefined".
However my address shows fine in my html portion of the web where it says
Address: {{organization ? organization.address : ''}}<br>
I am now wondering how to turn this text that displays after Address: in the string that needs to be passed along with function getLatLan.
I have tried making
let fulladdress = organization.address + organization...bla bla and passing this.fulladdress but it still displays that address,postal code, city is undefined
Any help is appreciated.
