Angular google map getting undefined lat long on components load

Question

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>

Answer 1

一种解决方案是，以这种方式将子组件包装在*ngIf='coordinates'使子组件仅在拥有所需数据后才呈现（调用ngOnInit方法）。