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
550 stars 123 forks source link

Two or more multiselect fields with "select all" button #411

Open bonomi2003 opened 1 year ago

bonomi2003 commented 1 year ago

First of all, I would like to thank the programmers of the project. He is very good.

I have a project that I need to use 2 or more "ionic-selectable" on the same page and both have to have the "select all" button. These fields are created dynamically.

the usage examples have a selector to identify the fields like:

@ViewChild('portComponent') **portComponent**: IonicSelectableComponent;

<ionic-selectable **#portComponent >** </ionic-selectable>

as the fields are generated dynamically, I can't create the selector dynamically. Today only the first field works, the others are giving error.

My field today has the following code:

`<ionic-selectable

portComponent

[(ngModel)]="questionBloco.opcaoSelecionadaArray" 
itemValueField="id"                                           
itemTextField="descricao" 
closeButtonText="X"
searchPlaceholder="Pesquisar"
[searchFailText]="'Nenhum registro encontrado!'"
[items]="questionBloco.opcoes | sort : 'descricao'"
[canSearch]="true"                                      
[isMultiple]="true"                                                                                 
name="question-{{questionBloco.id}}-{{blocos.sequencia}}"     
[hasVirtualScroll]="true"

`

as you can see the name field is generated dynamically, but I can't do the same with the #portComponent selector.

Is there any way to solve this problem?