来自 *ngFor 循环的角度总和动态数据以获取总计、小计和增值税值 (%16) [英] Angular sum dynamic data from *ngFor loop to get total, subtotal and vat value (%16)

问题描述

所以我遇到了问题.我需要根据 *ngFor 循环中的动态数据动态计算 tag.price 的总和，还有 sub-total 和 vat.下面是我的 html 和我的 ts 代码.小计、总计和增值税值将在此块下方的循环之外.任何帮助将不胜感激.

 <td align="center"><span style="font-size: 17px;"类=菜单图标icon-file-text2"></span></td><td>{{tag.title}}</td>{{tag.listingType}}<th>{{ tag.size }}</th><td>KSH {{tag.price |数量:语言环境}}</td><td>KSH {{tag.price |数量:语言环境}}</td></tr>//组件 tssetTags(id:any, title:any, price:any,listingType:any, size:any){this.locations.push({标题:标题，身份证:身份证，价格:价格，上市类型:上市类型，尺寸:尺寸});

}

解决方案

你可以在 typescript 中使用一个函数，也可以只绑定一个表达式.

功能:

{{locationSum() }}
公共位置Sum() {return this.locations.map(tag => tag.price).reduce((a, b) => a + b, 0);}

表达:

{{locations.map(tag => tag.price).reduce((a, b) => a + b, 0) }}

<小时>

我不确定您所说的小计"和增值税"是什么意思，但假设这些是基于价格的计算，那么概念应该是相同的.

<小时>

我最初发布的表达式选项不起作用.请参阅 https://github.com/angular/angular/issues/14129 了解更多信息信息.

so I'm having a problem. I need to calculate total of tag.price on the fly from dynamic data in the *ngFor loop, also sub total and vat. Below is my html and also my ts code. The sub total, total and vat value will be outside of the loop just under this block. Any help will be greatly appreciated.

 <tr *ngFor="let tag of locations">

 <td align="center"><span style="font-size: 17px;" class="menu-icon 
 icon-file-text2"></span></td>

 <td>{{tag.title}}</td>

 <th>{{tag.listingType}}</th>

 <th>{{ tag.size }}</th>

 <td>KSH {{tag.price | amount:locale}}</td>

 <td>KSH {{tag.price | amount:locale}}</td>

 </tr>


 // component ts
 setTags(id:any, title:any, price:any, listingType:any, size:any){
this.locations.push({
  title: title,
  id: id,
  price: price,
  listingType: listingType,
  size: size
});

}

解决方案

You can either use a function in the typescript, or you can just bind do an expression.

Function:

<div>
  {{ locationsSum() }}
</div>

public locationsSum() {
  return this.locations.map(tag => tag.price).reduce((a, b) => a + b, 0);
}

Expression:

<div>
  {{ locations.map(tag => tag.price).reduce((a, b) => a + b, 0) }}
</div>

---

I'm not sure what you mean by "sub total" and "vat value", but assuming those are calculations based on the price, the concept should be the same.

---

EDIT: The Expression option I originally posted does not work. See https://github.com/angular/angular/issues/14129 for more info.

这篇关于来自 *ngFor 循环的角度总和动态数据以获取总计、小计和增值税值 (%16)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！