Capture and create array of objects by checkbox Ionic 3

0

My question, I think it's something simple, but I can not come up with a logic.

I own a sales application, which has a list of products being returned from the firebase, and each product has a checkbox next to it for marking. The logic is, the customer selects the product in the checkbox and triggers an event that captures this product and I pass it through NAVPARAMS to the sales screen. So good.

The problem is this, there will be the case of the customer selecting more than one item at a time to make the sale to expedite the process. I understand that I would need to create an array and pass that array to the next screen. But I'm not able to do this, could anyone give me some code example or suggest some improvement? I'll leave down my ts code and my html.

TS:

//FUNÇÃO QUE CAPTURA O VALOR DO CHECKBOX E ARMAZENA NA VARIÁVEL PARA PASSAR COMO PARAMETRO

produtoEscolhido(produto, isChecked){
    if(isChecked) {
      this.produtosEscolhidos = produto;
      let produtos = [this.produtosEscolhidos];
      console.log(produtos);
    }
}

HTML:

//LISTA DE PRODUTOS COM O EVENTO PRODUTO ESCOLHIDO QUE CAPTURA O ITEM QUE O USUÁRIO SELECIONOU

<ion-list *ngFor="let produto of produtosLista | async">
    <ion-item>
        <ion-label>{{produto.descricao}}</ion-label>
        <ion-checkbox [(ngModel)]="produto.selecionado" (ionChange)="produtoEscolhido(produto, $event.checked)"></ion-checkbox>
    </ion-item>
</ion-list>

    <button ion-button color="dark" (click)="escolherProdutos()">Escolher</button>
</ion-content>
    
asked by anonymous 25.08.2018 / 16:30

1 answer

0

Instead of capturing the values of the checkbox in ionchange , you can capture in button , in the escolherProdutos() function, for example. You can check all of your products and identify which ones are selected, then pass them as a parameter.

escolherProdutos(){

  let produtosEscolhidos = [];

  for(let i=0; i<this.produtosLista.length; i++){
    if (this.produtosLista[i].selecionado){
      produtosEscolhidos.push(this.produtosLista[i]);
    }    
  }

}
    
25.08.2018 / 23:34