Как я могу вычислить СУММУ столбца таблицы в угловых 6?

Question

У меня есть таблица, которая начинает динамически фильтроваться (Pipes) в соответствии с выбором пользователя.

Мне нужно ввести итоговую строку внизу, которая будет отображать сумму столбца item.total, этокод, каков наилучший способ его реализации?

  <tbody>
      <tr class="newLine" *ngFor="let item of records | filter:profile | location:selectedRegion ">
        <td scope="row">{{item.name}} </td>
        <td scope="row">{{item.profile}} </td>
        <td scope="row">{{item.location}} </td>
        <td scope="row">{{item.numOfTags}}</td>
      </tr>
      <tr>{{total numOfTags??}}</tr>
  </tbody>

Answer 1

Я нашел другой способ воспроизвести ваш код с лучшей производительностью. Вот код:

<div    *ngFor="let item of records | yourfilterChain;let last=last;let sum=ngForOf.reduce((a,b)=>a+b,0)" >
     {{item}}
     <div *ngIf="last">{{sum}} </div>
</div>

Вы можете вычислить сумму отфильтрованного результата с помощью функции стрелки внутри ngfor

Answer 2

Создайте новую трубу фильтра, которая вычисляет сумму с текущим фильтром

import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
  name: 'filtercount'
})
export class FilterPipe implements PipeTransform {
  transform(items: any[], searchText: string): any[] {
    if(!items) return [];
    if(!searchText) return items;
searchText = searchText.toLowerCase();
return items.filter( it => {
      return it.name.toLowerCase().includes(searchText);
    }).reduce((a, b) => a.total + b.total, 0);
   }
}

и используйте ее следующим образом

{{records | filtercount:profile}}