如何从 JSON API 循环数组

Question

我想从 Angular2 中的 JSON API 循环数组，但我不知道怎么做？

我想获得小计的总金额。希望你们能帮助我。提前谢谢你。

Answer 1

试试看，希望对你有帮助

totalAmount:number = 0;
for(let i=0;i<this.data.length;i++){
    totalAmount = totalAmount  + this.data[i].cart_subtotal;
}

如果cart_subtotal 给出字符串值，则使用：

totalAmount = totalAmount  + parseInt(this.data[i].cart_subtotal);

Answer 2

我认为更好（更现代）的方法是使用 reduce 函数，因为求和是 reduce 函数的典型示例。你可以这样做：

let sum = ((items, prop) => {
    return arr.reduce((a, b) => {
        return a + b.prop;
    }, 0)
})

let sum = sum(cartInfo, 'cart_subtotal')

这不是一个经过测试/工作的示例，但应该让您很好地了解如何以实用和现代的方式实现这种行为:)

Answer 3

您需要使用*ngFor 指令。 Here 是官方文档的链接，展示了如何使用 *ngFor 指令。在您的情况下，您需要使用对象中的属性，因此我在下面的示例中添加了属性，该示例来自 Angular 文档。您可以使用标准点表示法访问每个单独对象的属性。

来自文档

<ul>
    <li *ngFor="let hero of heroes">
        {{ hero.firstName }} {{ hero.lastName }}
    </li>
</ul>

更新

因此，如果您只想将所有cart_subtotals 相加，那么您需要在组件中声明一个属性，然后在向数组中添加新对象时更新grandTotal。我不知道您如何将项目添加到数组中，但是每次添加新项目时都需要执行下面相应标记的部分。看起来您的小计也是字符串形式的，因此您需要先解析它们，然后才能对它们进行任何数学运算。

// Declare in your component
private grandTotal: number = 0;

// Run anytime an object is added to the array.
updateGrandTotal() {
    // Instantiate a temporary new grand total variable.
    let newGrandTotal = 0;
    // Iterate over each cart item.
    this.carts.forEach(_Cart => {
        // Add the current cart subtotal to the new grand total.
        newGrandTotal = newGrandTotal + parseInt(_Cart.cart_subtotal)
    })
    // Save the New GrandTotal to the Grand Total Property.
    this.grandTotal = newGrandTotal;
}