1

Estou tentando decrementar e calcular valores de um array sem êxito. A decrementação funciona até certo ponto, logo decrementa valores diferentes do que é clicado na checkbox e o cálculo aparece no console como NaN.

orders = [
{id_service: "1", id_empresa: "9", nome_service: "Servico 01", qtd: "0", checkup: "false", price_service : "250"},

{id_service: "2", id_empresa: "9", nome_service: "Servico 02", qtd: "0", checkup: "false" price_service : "300"},

{id_service: "3", id_empresa: "9", nome_service: "Servico 03", qtd: "0", checkup: "false" price_service : "400"}
]

calc(i) {
  let obj = JSON.parse(this.orders[i].price_service);


  if (this.orders[i].qtd == 0) {
    this.result.push(obj);
    this.orders[i].qtd = 1;
  }
  else {
    this.result.splice(i, 1);
    this.orders[i].qtd = 0;
  }
  this.result.reduce(function (a, b) {
    return a + b['obj'];
  }, 0);
  
}
<div *ngFor="let item of orders; let i = index; ">
    <ion-item>
      <ion-label class="title">{{item.nome_service}}
        <span>{{item.price_service}}</span>
      </ion-label>
      <ion-checkbox (click)="calc(i)" checked="{{item.checkup}}" color="green"></ion-checkbox>
    </ion-item>
    <p>{{result}}</p>
  </div>

3
  • não entendi onde está decrementando o valor no código, pude entender que está apenas setando "0" ou "1", pode explicar melhor? Commented 19/03/2018 às 11:25
  • @RicardoPontual estou decrementando com a função splice dentro de else Commented 19/03/2018 às 12:16
  • Eu vi essa linha, então você está removendo itens do array. Isso não vai funcionar porque, quanto você executa o binding do angular, os índices serão sequencias, ou seja: 1,2,3 ou 0,1,2 dependendo de index, e você passa esse índice para function no click com o calc(i). Se você clicar o primeiro item por exemplo, ele vai remover o elemento 1, logo, o elemento 2 passa a ser o primeiro. O que vai acontecer quando você clicar no elemento 2? Vai ser removido o segundo elemento, que agora é o 3! Tente passar o id_servicepara a function calc para remover o elemento correto. Commented 19/03/2018 às 13:05

1 Resposta 1

1

Já que a intenção é somar o valor de price_service de todos os items que contém a propriedade qtd igual a 1, não há a necessidade de criar um novo objeto. Basta apenas filtrar o objeto orders utilizando o método filter e recuperar todos os items que contém a propriedade qtd igual a 1, depois utilizar o método reduce.

Tomei a liberdade de fazer algumas modificações, para facilitar, removi todas as aspas duplas das propriedades que são do tipo número e booleano.

orders = [
  { id_service: 1, id_empresa: 9, nome_service: "Servico 01", qtd: 0, checkup: false, price_service: 250 },
  { id_service: 2, id_empresa: 9, nome_service: "Servico 02", qtd: 0, checkup: false, price_service: 300 },
  { id_service: 3, id_empresa: 9, nome_service: "Servico 03", qtd: 0, checkup: false, price_service: 400 }
];

Crie uma variável para armazenar o valor da soma:

total: number = 0;

Seu método calc ficou assim:

calc(i) {
  this.orders[i].qtd = (this.orders[i].qtd === 0) ? 1 : 0;
  this.total = this.orders.filter(item => item.qtd === 1).reduce((a, b) => a + b.price_service, 0);
  console.log(this.total);
}

Explicação

Quando executa this.orders.filter(item => item.qtd === 1) é retornado um novo array com os elementos que passaram no teste implementado pelo método fornecido, que no caso é: item => item.qtd === 1.

No método reduce é feita a soma do valor de a com o valor da propriedade price_service do elemento b.

Você pode ver funcionando em stackblitz

5
  • não consegui implementar, pois os dados vem do banco, e parece que vem dentro do objeto com aspas duplas = qtd: "0". Acredito que seja por isso que não estou conseguindo fazer, fiz local sem as aspas e funcionou, agora não sei como fazer para tratar essas propriedades vindo do banco, saberia me ajudar? Commented 21/03/2018 às 0:15
  • pior que o price_service tb vem assim, com aspas, e dentro da função filter não aceitou aspas, nem simples... Commented 21/03/2018 às 0:21
  • Assim parseInt(b.price_service) tambem não foi, tentei assim parseInt(b[i].price_service) e foi, mas não funcionou, acredito que seja pela questão da função filter não aceitar aspas... Commented 21/03/2018 às 0:29
  • 1
    Veja funcionando aqui stackblitz
    – NoobSaibot
    Commented 21/03/2018 às 0:36
  • vlw brother!!!! Commented 21/03/2018 às 0:40

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .