eakoriakin / ionic-selectable

Ionic Selectable is an Ionic versatile and highly customizable component that serves as a replacement to Ionic Select, and allows to search items, including async search, create items, customize the layout with templates and much more. It provides an intuitive API and is easy to set up and use.
MIT License
549 stars 125 forks source link

how to preselect values #389

Closed bayarder closed 2 years ago

bayarder commented 2 years ago

I have an array of values with true or false

question.values = [ { "key": "xx", "value": "yy", "isChecked": false }, { "key": "xx", "value": "yy", "isChecked": true }, { "key": "xx", "value": "yy", "isChecked": false } ]

How to preselect value with true in html code

image

w-mazed commented 2 years ago

Hi @bayarder,

If you are using FormControl :

<ionic-selectable
    [canSearch]="true"
    formControlName="region"
    [items]="regions"
    itemValueField="code"
    itemTextField="name">
</ionic-selectable>

in your ts file you have just to set the FormControl inside a setTimeout like :

// ...code
public regions: Array<any> = [{code: "1", name: "Region 1"}, {code: "2", name: "Region 2"}];

// ...code
setTimeout(() => {
    this.region.setValue({code: "2", name: "Region 2"});
});

You'll get the ion-selectable label updated.

Good luck.