angular 2如何对列ng进行求和

时间:2017-08-02 17:37:27

标签: angular

试图理解如何从表中对列进行求和,每个都添加* ngFor(如todo-list),我想总结一列,我怎么能在角2中做到? 所以我有这样的表:

<tr *ngFor="let item of items">
    <td>{{item.num1 }}</td>
    <td>{{item.num2}}</td>
    <td>{{item.num3}}</td>
    <td>{{item.num4}}</td>
    <td>{{item.num5}}</td>
</tr>

我需要总结以下所有列:

<tr *ngFor="let item of items">
     <td>{{item.num1 }}</td>
     <td>{{item.num2}}</td>
     <td>{{item.num3}}</td>
     <td>{{item.num4}}</td>
     <td>{{item.num5}}</td>
</tr>
<tr>
     <td>SUM1</td>
     <td>SUM2</td>
     <td>SUM3</td>
     <td>SUM4</td>
     <td>SUM5</td>
</tr>

2 个答案:

答案 0 :(得分:7)

你必须在Angular 2 Component类中创建一个getSum(index:number):number方法,如下所示:

getSum(index: number) : number {
  let sum = 0;
  for(let i = 0; i < this.items.length; i++) {
    sum += this.items[i][index];
  }
  return sum;
}

并在您的html中,将您的SUMX替换为:

<td>{{ getSum(0) }} </td><td>{{ getSum(1) }}</td> ...

当然,如果需要,你当然也可以使用ngFor来创建多个td标签。

[编辑]:根据你的小提琴获得所需的确切代码:

  getSum(column) : number {
    let sum = 0;
    for(let i = 0; i < this.list.length; i++) {
      sum += this.list[i][column];
    }
    return sum;
  }

并在html中:

<td>{{ getSum('newInput') }}</td><td>{{ getSum('newOutput') }}</td>

[编辑2]:为了完整性,你也可以使用reduce函数来做一个数组的总和,而不是在getSum方法中使用循环:

var sum = this.items[i]['myfield'].reduce(function(x, y) { return x + y; }, 0);

答案 1 :(得分:1)

max_connections = 800            
shared_buffers = 9GB     
effective_cache_size = 18GB   
work_mem = 10MB  
maintenance_work_mem = 1536MB   
checkpoint_segments = 50
wal_keep_segments = 80
checkpoint_completion_target = 0.9
wal_buffers = 16MB
Max_prepared_transactions =0  
synchronous_commit = on