angular 2如何总结列ng对于

试图了解如何总结表中的列，每一个都添加* ngFor（如todo-list），我想总结一列，我怎么能在角2中做到这一点？所以我有表是这样的：angular 2如何总结列ng对于

<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>

来源

2017-08-02 shoopik

总结TS代码并使用绑定显示它。 '* ngFor'不加和。 –

它看起来很直接，你试了什么 – Skeptor

你将不得不创建一个getSum（索引：号码）：在号码的方法你角2组件类，像这样：

：

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]：只是为了完整性，还可以

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

来源

2017-08-02 17:49:11

我做到了，但现在有空场 – shoopik

无法读取未定义的属性'0' – shoopik

你使用了这个关键字吗？ this.items？看来你没有访问正确的属性。如果你有一个矩阵（例如：items：number [] []），this.items [i] [index]就可以工作。 –

-1

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

：使用降低功能，而不是在getSum方法使用循环做阵列的总和

来源

2018-01-13 16:14:41

从另一个答案复制代码块，并发布为唯一的答案不帮助任何人。这个问题如何提供比你复制代码的答案更好的解决方案？ – Claies

this.items [i] .num1;请注意点运算符以访问必填字段。提供的答案使用矩阵格式。这给了我一个错误。 –

angular 2如何总结列ng对于

回答

相关问题