Question

我有一系列产品，每个产品都有价格。我想创建一个过滤器来计算所有产品的总价。问题是我在回调函数中，因此无法使用 forEach（）。我的问题是，是否有一个功能类似于 myArray。（intheobject）.price 的函数，还是一种管理回调并获得正确结果的方法？

this.productList = [
    {
      type: 'chocolate',
      pack: '3',
      price: 5,
      checkState: false
    },
    {
      type: 'chocolate',
      pack: '5',
      price: 7,
      checkState: false
    },
    {
      type: 'chocolate',
      pack: '10',
      price: 10,
      checkState: false
    },
    {
      type: 'honey',
      pack: '3',
      price: 5,
      checkState: false
    },
    {
      type: 'honey',
      pack: '5',
      price: 7,
      checkState: false
    },
    {
      type: 'honey',
      pack: '10',
      price: 10,
      checkState: false
    },
    {
      type: 'candy',
      pack: '3',
      price: 5,
      checkState: false
    },
    {
      type: 'candy',
      pack: '5',
      price: 7,
      checkState: false
    },
    {
      type: 'candy',
      pack: '10',
      price: 10,
      checkState: false
    }
  ]


.filter('calculateTotal', function(){
  var totalCost = 0;
  return function(input){
    return totalCost + ???
  }    
})

在PierreDuc的回答之后，我的过滤器是这样的：

.filter('calculateTotal', function(){
  return function(input){
    return input.reduce((total, item) => item.price + total, 0);
  }    
})

Answer 1

您可以为此使用reduce方法：

const totalPrice = [{
    type: 'chocolate',
    pack: '3',
    price: 5,
    checkState: false
  },
  {
    type: 'chocolate',
    pack: '5',
    price: 7,
    checkState: false
}].reduce((total, item) => item.price + total, 0);

过滤器，顾名思义，用于根据提供的方法的返回值过滤当前数组。

使用reduce可以基于输入0变换数组。这将分配给所传递方法的total参数，其中item是数组中的每个项目。从该方法返回的值将是total参数的新值。

Answer 2

filter回调可以访问每个元素。因此，您需要在回调函数之外创建一个全局变量，并将回调函数中每个元素的值添加到该全局变量中。参见filter documentation。

this.totalCost = 0;

this.productList = [
    {
      type: 'chocolate',
      pack: '3',
      price: 5,
      checkState: false
    },
    {
      type: 'chocolate',
      pack: '5',
      price: 7,
      checkState: false
    },
    {
      type: 'chocolate',
      pack: '10',
      price: 10,
      checkState: false
    },
    {
      type: 'honey',
      pack: '3',
      price: 5,
      checkState: false
    },
    {
      type: 'honey',
      pack: '5',
      price: 7,
      checkState: false
    },
    {
      type: 'honey',
      pack: '10',
      price: 10,
      checkState: false
    },
    {
      type: 'candy',
      pack: '3',
      price: 5,
      checkState: false
    },
    {
      type: 'candy',
      pack: '5',
      price: 7,
      checkState: false
    },
    {
      type: 'candy',
      pack: '10',
      price: 10,
      checkState: false
    }
  ]
var self = this;
angular.module('myReverseFilterApp', [])
.filter('calculateTotal', function(){
      return function(input) {
           self.totalCost += input.price;
      }
})

然后，您可以在HTML中访问totalCost变量。无法从过滤器函数返回totalCost，因为此函数已应用于数组的每个元素。语法可能不正确，但是我想您的主旨是

。

Answer 3

const productList = [
    {
      type: 'chocolate',
      pack: '3',
      price: 5,
      checkState: false
    },
    {
      type: 'chocolate',
      pack: '5',
      price: 7,
      checkState: false
    },
    {
      type: 'chocolate',
      pack: '10',
      price: 10,
      checkState: false
    },
    {
      type: 'honey',
      pack: '3',
      price: 5,
      checkState: false
    },
    {
      type: 'honey',
      pack: '5',
      price: 7,
      checkState: false
    },
    {
      type: 'honey',
      pack: '10',
      price: 10,
      checkState: false
    },
    {
      type: 'candy',
      pack: '3',
      price: 5,
      checkState: false
    },
    {
      type: 'candy',
      pack: '5',
      price: 7,
      checkState: false
    },
    {
      type: 'candy',
      pack: '10',
      price: 10,
      checkState: false
    }
  ]
let totalPrice = productList.reduce(function(sum, currentValue, currentIndex, array) {
  return sum+currentValue['price']
},0);
console.log(totalPrice)

Answer 4

您可以执行以下操作，首先获取所有价格的列表并将其存储在数组中，然后使用reduce函数对价格执行操作还请阅读reduce函数的文档：

reduce documentation

let pricesList = [];
productList.forEach(product => {

    pricesList.push(product['price']);

})

let sumPrice = pricesList.reduce((priceA, priceB) => priceA + priceB, 0);

在数组Javascript AngularJS中访问对象的属性

4 个答案: