时间戳

首页 > 解决方案 > 从服务中获取地图操作员

angular - 从服务中获取地图操作员

问题描述

这是一个简单的概念，但它在我的脑海中飞舞。

getHoleLng(id: number | string) {
return this.getHoles().pipe(
  map(holes => holes.find(hole => hole.id === +id).lng)
  );
}

我试图从我的服务中获取此方法，我想知道如何在我的地理定位组件中获取它？

Haversine(): void {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition( x => {

      this.myLat = x.coords.latitude;
      this.myLng = x.coords.longitude;

      this.courseLat = this._mont.getHoleLat();
      this.courseLng = this._mont.getHoleLng();


    console.log(`longitude: ${ this.courseLat } | latitude: ${ this.courseLng }`);
    console.log(`longitude: ${ this.myLat } | latitude: ${ this.myLng }`);


    const myCoords: GeoCoord = {
      latitude: this.myLat,
      longitude: this.myLng
    };

    const dominos: GeoCoord = {
      latitude: this.courseLat,
      longitude: this.courseLng
        // latitude: this.courseLat,
        // longitude: this.courseLng
    };

    this.metres = this._haversine.getDistanceInMeters(myCoords, dominos);
    this.yards = this._haversine.getDistanceInYards(myCoords, dominos);
    this.kilometres = this._haversine.getDistanceInKilometers(myCoords, dominos);
    this.miles = this._haversine.getDistanceInMiles(myCoords, dominos);

    this.metres = this.metres.toFixed(2);
    this.yards = this.yards.toFixed(2);
    this.kilometres = this.kilometres.toFixed(2);
    this.miles = this.miles.toFixed(2);
 });
}

}

编辑

export class Hole {
  constructor(public id: number, public name: string, public lat: number, public lng: number) { }
}

const HOLES = [
   new Hole(1, 'Hole 1', 1234567, -12345324)
  ];

我正在尝试获取这些坐标！

标签： angulartypescriptooprxjsngrx

解决方案

您需要导入服务并将其注入到您的组件中。

在您的<name>.component.ts：从“servicePath”导入{YourService}；

export class NameComponent{
   // inject it here
   constructor(private yourService : YourService){
     // call it here (or elsewhere)
     this.yourService.getHoleLng(id).subscribe(...)
   }
}

或在您的函数中调用它：

Haversine(): void {
  // suppose for the example that id=1;
  let id = 1; // to be replaced by the wanted id

  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition( x => {

      this.myLat = x.coords.latitude;
      this.myLng = x.coords.longitude;

      forkJoin(
         this.yourService.getHoleLng.pipe(map( lng=> courseLng=lng)),
         this.yourService.getHoleLat.pipe(map( lng=> courseLng=lat))
      ).subscribe( ()=> {
           console.log(`longitude: ${ this.courseLat } | latitude: ${ this.courseLng }`);
            console.log(`longitude: ${ this.myLat } | latitude: ${ this.myLng }`);

         const myCoords: GeoCoord = {
           latitude: this.myLat,
           longitude: this.myLng
         };

         const dominos: GeoCoord = {
           latitude: this.courseLat,
           longitude: this.courseLng
           // latitude: this.courseLat,
           // longitude: this.courseLng
         };

         this.metres = this._haversine.getDistanceInMeters(myCoords, dominos);
         this.yards = this._haversine.getDistanceInYards(myCoords, dominos);
         this.kilometres = this._haversine.getDistanceInKilometers(myCoords, dominos);
         this.miles = this._haversine.getDistanceInMiles(myCoords, dominos);

         this.metres = this.metres.toFixed(2);
         this.yards = this.yards.toFixed(2);
      })    

}

问题是您需要等待服务返回坐标lat和坐标，然后再进行进一步处理。lng我使用forkJoin操作员等待两个呼叫完成。

推荐阅读