Question

我收到以下服务回复：

dodo: [{
    "did": 1,
    "dname": "Test name",
    "dep": [{
        "cid": 1645,
        "cname": "Table"
     }, {
        "cid": 1651,
        "cname": "Cage"
     }, {
        "cid": 1654,
        "cname": "Accounting"
     }]
     }, {
    "did": 1064,
    "dname": "CB-APIR",
    "dep": [{
        "cid": 1363,
        "cname": "Cage"
     }, {
        "cid": 1364,
        "cname": "Operations"
     }]
}]

现在，我有一个表结构，其中正在dep上循环，如下所示：

<span *ngFor="let se of element.dodo; let i=index">
    {{ se.dep.length }}
 </span>

上面的循环在总计列中将数据显示为3 2，而我将获得5作为列值。

如何添加值并将其设置为5？

Answer 1

您可以计算组件中的总和：

ngOnInit(){
  this.amountDeps = this.element.dodo.reduce((sum, dod) => sum + dod.dep.length, 0)
}

Answer 2

这是一个实现Baron和tano提出的解决方案的堆叠闪电战。

https://stackblitz.com/edit/angular-usejve

Answer 3

在ts中添加功能

count(){
  return this.element.dodo.reduce((sum, dod) => sum + dod.dep.length, 0)
}

并在模板中的适当位置调用它。应该在循环外调用

    ...
    simply displays a total by dodo:
    <span *ngFor="let se of element.dodo; let i=index">
       {{ se.dep.length }}
    </span>
    displays the accumulated value:
    <span>{{count()}}</span>
    ...

ngFor添加数组长度-角度6

3 个答案: