当我再次单击一行时减去变量答案

【问题标题】：Subtract variable when I click again on a row当我再次单击一行时减去变量
【发布时间】：2023-01-17 20:19:05
【问题描述】：

当我单击一行时，它会添加金额。例如，如果我单击两行，它会添加金额（我添加图像）。

我怎样才能做到这一点，当我点击其中一行时，所选行的数量就会被减去？

我的 HTML：

<tbody>
    <tr *ngFor="let item of articulos; index as i" (click)="total(item.cantidad)">
        <td>{{item.articulo}}</td>
        <td>{{item.cantidad}}</td>
        <td>{{item.recogida}}</td>
    </tr>
    <br>
</tbody>

<div type="button" class="col border border-white border-4" id="other" type="button" routerLink="/entry-order-lines-quantity" style="background-color:rgb(3, 71, 150);">Cantidad {{totalCantidad}} 
</div>

我的：

export class EntryOrderLinesComponent implements OnInit {

  articulos = [
    {
      articulo: '385/65X22.5 HANKOOK AH51 160K (3003836)',
      cantidad: 94,
      recogida: '0',
    },
    {
      articulo: '385/65X22.5 HANKOOK TH31 164K (3003309)',
      cantidad: 60,
      recogida: '0',
    },
  ];
  
  totalCantidad: number = 0;

  constructor(private datosService: DatosService, private fb: FormBuilder) {}

  total(cantidad: number) {
    this.totalCantidad += cantidad;
  }

My image

如果我选择该行，它会添加数量。我希望当我取消选择该行时，我减去金额。

谢谢

【问题讨论】：

标签： html angular angularjs

【解决方案1】：

在您的total 函数中，您可以更新所有选定文章的新列表，而不仅仅是将数量添加到总数中。然后您可以在单击时从列表中添加或删除单击的项目。

现在您可以简单地将项目列表映射到金额总和

...
  
  selectedItems = []
  total(article: any) {
    // find an item in the list with the same Article description 
    // which (hopefully) is an unique identifier and save its index
    const index = selectedItems.findIndex(item => item.articulo === article.articulo);
    if(index !== -1) {          // If the article was found, throw it out
      this.selectedItems.slice(index, 1);
    } else {                    // Otherwise add it
      this.selectedItems.push(article);
    }
  }

  getTotal() {
    return this.selectedItems.reduce((total, entry) => total += entry.cantidad);
  }

...

【讨论】：