After searching extensively, I couldn't find a similar issue. I am working with Ionic 4 in Angular 7 along with Typescript 3.16. I have multiple 'TimeSpan' values that I need to retrieve using a function from the HTML like so:
<ion-input type="text" (click)="getTypTime()" ....>
Here is the click handler function:
getTypTime() { // Retrieves the typical time
const currentTime = this.service.TimeToDoTypicalOrBestCase;
this.getTime(currentTime).then( res => {
console.log('GetTypTime result :'); // **3**
console.log(res);
});
}
The function responsible for presenting the picker and retrieving the result looks like this:
async getTime(inputTime: TimeSpan) {
console.log(inputTime); // **1**
const opts: PickerOptions = {
buttons: [
...more stuff...
],
columns: [
{
name: 'Hours',
...more stuff...
]
},
{
name: 'Mins',
...more stuff...
}
]
};
const picker = await this.pickerCtrl.create(opts);
console.log('Presenting picker'); // **2**
picker.present();
picker.onDidDismiss().then(() => {
picker.getColumn('Hours').then( colh => {
this.pickedTime.hours = colh.options[colh.selectedIndex].value;
picker.getColumn('Mins').then( colm => {
this.pickedTime.minutes = colm.options[colm.selectedIndex].value;
console.log(this.pickedTime); // **4**
return this.pickedTime.ToString();
});
});
});
}
The log outputs:
00:30:00 (This is at the beginning of the function **1** as per code)
Presenting picker (This appears towards the end of the function **2**)
GetTypTime result : undefined (This is in the CALLING function **3**)
(The following line displayed after the dismiss **4**)
TimeSpan {_seconds: 0, _minutes: 0, _hours: 0, _ days: 0, _milliseconds: 0, …}
It seems like the function is returning before completing the ondismiss action of the picker. Any idea where the issue lies..?
I had previously used await within the picker's onDidDismiss, like this:
picker.onDidDismiss().then(async () => {
let col = await picker.getColumn('Hours');
this.pickedTime.hours = col.options[col.selectedIndex].value;
col = await picker.getColumn('Mins');
this.pickedTime.minutes = col.options[col.selectedIndex].value;
console.log(this.pickedTime);
return this.pickedTime.ToString();
});
}
However, this approach didn't work so I made modifications by removing the awaits. What are your thoughts on this..?