Question

我从使用Django Framework创建的API中获取了一系列数据，然后使用* ngFor

将其循环到我的离子中

以下是代码示例：

"roles"

我想知道是否有任何想法让我在ts文件或html中计算{{user.fields.duration}}的总和？

我是离子新手，我不知道怎么做。请帮帮我，谢谢！

Answer 1

使用函数来执行此操作。

sumOf(field: string, array: number[]) {
  return array.reduce((p, n) => {
    p[field] += n[field];
    return p;
  }, 0);
}

在您的HTML中：

{{ sumOf('duration', user.fields) }}

该函数将以零值开始，然后将迭代数组的所有项目（给定字段），将其添加到原始数字，然后返回它。

Answer 2

您可以为sum创建角度管道：

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

@Pipe({
    name: 'sum'
})
export class SumPipe implements PipeTransform {
    transform(items: any[], attr: string): any {
        return items.reduce((a, b) => a + b[attr], 0);
    }
}

并称之为：

<span>{{ user.fields| sum:'duration' }}</span>

Ionic如何循环并计算* ngFor的值

2 个答案: