GeoLocationを取得してサービスに登録するAngular2 +

Question

Googleマップapiを使用してユーザーのgeoLocationを取得し、&情報を取得しています。 lat、lngをWeb APIサービスに渡して、周囲のアドレスのjson出力を取得したいと思います。 Web APIサービスからデータを取得するために、うまく動作するangular2コードを使用しています。

data.service.ts file: 
fetchData(lat: number, lng: number) { 
    return this._http.get('/url?lat=' + lat + '&lon=' + lng) 
     .map((response: Response) => response.json()); 
} 


app.component.ts 

ngOnInit（）{

var lat; 
    var lng; 

    if (navigator.geolocation) { 
     navigator.geolocation.getCurrentPosition(function (position) { 
      lat = position.coords.latitude; 
      lng = position.coords.longitude; 

     }); 

if ((lat != null) && (lng != null)) { 


this._dataService.fetchData(lat, lng).subscribe(res => { 
     this.dObj = res; 
    }); 
} 
} 

上記のコードは動作しない。以下

詳細ためのコードです。私はコードを使いこなしてみました。 fetchData（）は前に呼び出されます（私はその非同期から信じています）、何とか私はlat、lngをサービスに渡すことができません。

これを行う適切な方法はありますか？これを行う他の方法は何ですか？私が使用できる同様のことをするangular2ライブラリはありますか？助けてください

Answer 1

私はgetCurrentPosition()のコールバック関数の中にあなたのロジックを置くべきだと思います。確かにHTML5ジオロケーションは非同期なので、コールバックが発生する前にlatとlngを取得しようとするようです。

この

var lat; 
var lng; 

if (navigator.geolocation) { 
    navigator.geolocation.getCurrentPosition(position => { 
     lat = position.coords.latitude; 
     lng = position.coords.longitude; 

     if ((lat != null) && (lng != null)) { 

      this._dataService.fetchData(lat, lng).subscribe(res => { 
       this.dObj = res; 
      }); 
     } 
    }); 
} 

をお試しください