Angular 从网格列4获取总值

有人能帮我解决这个问题吗。我想得到最后一列值的总值。下面是我的HTML代码

  <div *ngFor="let order of orders |filter:searchText">
  <ion-row>
    <ion-col>
      <ion-text>
        {{order.OrderNo}}
      </ion-text>
    </ion-col>
    <ion-col>
      <ion-text>
        {{order.CustomerName}}
      </ion-text>
    </ion-col>
    <ion-col>
      <ion-text>
        {{order.PaymentType}}
      </ion-text>
    </ion-col>
    <ion-col>
      <ion-text>
        {{order.TotalPrice | currency:''}}
      </ion-text>
    </ion-col>
  </ion-row>
</div>
<h6>Total value: </h6>

{{order.OrderNo}
{{order.CustomerName}
{{order.PaymentType}
{{order.TotalPrice}货币：'}
总价值：

---

您可以在模板中使用javascript，如：

Total value:{{orders.reduce（（acc，nxt）=>acc+nxt）|货币：''}

然而，在模板中使用逻辑通常是不好的做法。在组件中创建函数并从模板中调用它： 示例.component.ts

//将任何类型替换为实际类型
总数（订单：任意[]）：编号{
退货订单.减少（（acc，nxt）=>acc+nxt）；
}

example.component.html

总值：{{sum（订单）|币种：''}}

尝试使用管道

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'total'
})
export class TotalPipe implements PipeTransform {
  transform(array: any): any {
    let total = 0;
    array.forEach(element => {
        total += element.totalPrice;
        // you may need to modify total price if it contains any currency and convert it into int
    });

    return total;
 }
}

并将其使用到html文件中，如

<h6>Total value: {{ orders | total }}</h6>

总值：{{orders | Total}

它没有工作。你能帮我解决这个问题吗；this.total=this.orders.map（a=>parseFloat（a.TotalPrice））.reduce（函数（a，b）{returna+b；}）；控制台日志（总计）；