Is it possible to autoselect and immediately jump to a certain value in an ion-picker? - ionic4

Question

I'm currently working on an ionic-app that uses ion-pickers, now here's my question:
If you have a certain value that is part of the possibly choosable values of the picker, can you jump to it and select it by default when you try to open the picker just like they did with the datetime-picker?
Because I have a lot of values for some of my pickers, it would be much easier and user-friendly, if it would just immediately jump to the earlier selected value or to a default value somewhere in the middle so that they don't have to scroll down the entire pickervalues-list if they misclicked or something. Now I know that this very nice feature is already implemented for the datetime-picker but I didn't find a possibility to use it on the ion-picker.
So does it exist for the ion-picker yet or is that part yet under development?

Answer 1

I found the answer myself after digging around in the forums (here's the link: https://forum.ionicframework.com/t/solved-how-to-preselect-ion-picker-items/163425)
Basically you only need to use:
picker.columns[0].selectedIndex = index;

Answer 2

An alternative is to set the default ion-picker's option on itself build as shown below:
const objOptions: PickerOptions = {
buttons: [
{
text: 'Cancel',
role: 'cancel'
},
{
text: 'Confirm',
handler: (value) => {
console.log(`Got Value ${value}`);
}
}
],
columns: [{
name: 'Animals',
options: [
{ text: 'Dog', value: 'Dog' },
{ text: 'Cat', value: 'Cat'}
],
selectedIndex: 0
}]
};
const objPicker = await pickerController.create(objOptions);
objPicker.present();

Answer 3

if you want to select by text or value
let columns: PickerColumn[] = [
{
name: 'Animals',
options: [
{ text: 'Dog text', value: 'Dog' },
{ text: 'Cat text', value: 'Cat'}
],
},
];
//autoselect by value
let index = columns[0].options.findIndex(x => x.value === 'Cat');
columns[0].selectedIndex = index > -1 ? index : 0;
//autoselect by text
index = columns[0].options.findIndex(x => x.text === 'Cat text');
columns[0].selectedIndex = index > -1 ? index : 0;
//autoselect by index
columns[0].selectedIndex = 1;
const objOptions: PickerOptions = {
buttons: [
{
text: 'Cancel',
role: 'cancel'
},
{
text: 'Confirm',
handler: (value) => {
console.log(`Got Value ${value}`);
}
}
],
columns: columns
};
const objPicker = await pickerController.create(objOptions);
objPicker.present();