CODEWITHSUNDEEP
javascriptangularionic-framework
BGTabulation BGTabulate
BGTabulation BGTabulate

Reputation: 1737

Angular google map getting undefined lat long on components load

I'm using Ionic-angular AGM. I'm trying to get my current location on components load. But it seems like its firing the component first before it loads that's why its not reading my latitude and longitude. How to make it like reactive?

export class DriverMapComponent implements OnInit {
  coordinates;

constructor(
    private navCtrl: NavController,
    private http: HttpClient,
    private route: ActivatedRoute,
    private storage: Storage
  ) {
    //I also tried here but not working
  }

ionViewWillEnter(){
   //not working
}

ngOnInit() {
    this.storage.get("sr_details").then(params => {
      if (params) {
        this.coordinates = {
          lat: params.pickuplat,
          long: params.pickuplong
        };
        console.log(this.coordinates);
      }
    });
  }

AGM

<ion-content>
  <agm-map
    [zoom]="15"
    [latitude]="coordinates.lat"
    [longitude]="coordinates.long"
  >
    <!-- <agm-direction
          *ngIf="address.place !== '' && destination.palce !== ''"
          [origin]="ori"
          [destination]="des"
        ></agm-direction> -->
    <agm-marker
      [latitude]="coordinates.lat"
      [longitude]="coordinates.long"
    ></agm-marker>
  </agm-map>
</ion-content>

Upvotes: 0

Views: 82

Answers (1)

Sam
Sam

Reputation: 1851

One solution would be to wrap the child component in *ngIf='coordinates' this way the child will only render (call the ngOnInit method) once you have the required data.

Upvotes: 3

Related Questions