How Ionic constructor works - constructor

Question

I have a problem with ionic constructor. Actually a Java program constructor works line by line. But in my Ionic application I have called a back-end service and getting some data and populate my variables with the received data.
constructor(public navCtrl: NavController, public navParams: NavParams, public patientService: PatientServiceProvider, public scanner: BarcodeScanner) {
this.id = this.navParams.get('id');
this.patientService.searchPatientById(this.id).subscribe(res => {
this.id = res.id;
this.mobile = res.mobile;
this.fname = res.firstname;
this.lname = res.lastName;
console.log("print this:"+this.mobile);
});
this.mobile = this.navParams.get('mobile');
console.log(this.id);
console.log("****"+this.mobile);
}
In above code my service working fine. My problem is last line execute before the service call. That means my output will look like
5656
"****"[phone]
print this:undefined
Why this happened. This is not executed line by line.

Answer 1

Your patientService returns an Observable, so so functionCall searchPatientById() is asyncron. That means that after the Functioncall the next lines will be executed and the part in the subscribe is executed when you get a result.
To avoid that, you have more options, for example you can create another method which should be executed AFTER the async call and than call that method at the end in the subscribe. Or you can use async/await like this:
constructor(public navCtrl: NavController, public navParams: NavParams, public
patientService: PatientServiceProvider, public scanner: BarcodeScanner) {
this.init();
}
async init() {
this.id = this.navParams.get('id');
let res = await this.patientService.searchPatientById(this.id);
this.id = res.id;
this.mobile = res.mobile;
this.fname = res.firstname;
this.lname = res.lastName;
console.log("print this:"+this.mobile);
this.mobile = this.navParams.get('mobile');
console.log(this.id);
console.log("****"+this.mobile);
}