Verarbeiten von asynchronen Daten zwischen Services und Komponenten in Angular

Question

Ich übergebe die Breite und Länge an einen Dienst von einer Komponente. Und nach einigen Arbeiten im Service möchte ich den Wert in isOnsite an meine Komponente übergeben. Abhängig von diesem Wert möchte ich eine weitere Seite aufrufen.

Mein Problem:

Als ich den zurückgegebenen Wert in der Komponente zu erhalten, ist es nur undefined wie der Dienst asynchron ausgeführt wird. Was kann ich in meinem Code ändern, um den richtigen Wert in meiner Komponente zu erhalten? Unten ist mein Code. (isAtSite berechnet etwas Mathematik und gibt einen booleschen Wert zurück).

Gibt es auch eine Möglichkeit, den Seitenstapel vom Dienst zu schieben?

location.service.ts

getDeviceCoords(map, destLat, destLng) { 

this.mapInstance = map; 
this.geolocation.getCurrentPosition().then((pos) => { 

    new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude); 
    let deviceLat = pos.coords.latitude; 
    let deviceLng = pos.coords.longitude; 

    let isOnSite = this.isAtSite(deviceLat, deviceLng, destLat, destLng); 
    return isOnSite; 

}, (err) => { 
    console.log(err); 
}); 
} 

map.component.ts

getDeviceCoords(){ 

let isOnSite = this.geolocationProvider.getDeviceCoords(this.map, this.lat, this.lng); 
console.log("isOnSite (map.ts) =>" + isOnSite); //undefined. Should be boolean 
} 

Answer 1

Es ist nicht definiert, weil Sie etwas von der Funktion getDeviceCoords(map, destLat, destLng) (das entspricht undefined) Rückkehr didnt zurückzukehren

return isOnSite insi de getDeviceCoords gibt wirklich nicht von getDeviceCoords, sondern von Rückruf then weitergegeben - (pos) => {}

Also, zunächst einmal müssen Sie Versprechen von getDeviceCoords zurück:

getDeviceCoords(map, destLat, destLng) { 

    this.mapInstance = map; 
    return this.geolocation.getCurrentPosition().then(...your code); 
} 

Und dann in der Komponente können Sie es wie

getDeviceCoords() { 
    this.geolocationProvider.getDeviceCoords(this.map,this.lat, this.lng) 
    .then(isOnSite => // your value can be accessed here); 
}