Javascript / AngularJS:如何比较数组中对象元素的相等性

Javascript / AngularJS: How to compare Object element equality in Array?

本文关键字：对象 数组 元素 比较 AngularJS 何比较 Javascript      更新时间：2023-09-26

我为每个独特的颜色创建了一堆复选框。然而，我遇到了一个错误，我有重复的颜色。

我使用JSON生成这个颜色数组。我循环遍历所有产品，如果$scope.colors变量中不存在颜色，则将color对象推入。

然而，看起来我对相同颜色的物体的比较失败了。它们的值相同，如el1 = {name: 'Red, id: 1}和el2 = {name: 'Red, id: 1}，但似乎使用Array.indexOf(color)总是返回-1。

在我的角控制器中，我有这个:

$scope.colors = []; // empty array
$scope.setFilterChoices = function(data) {
  for (var i = 0; i < data.length; i++) {
    var product = data[i];

    for (var j = 0; j < product.products_colors.length; j++) {
      var product_color =  product.products_colors[j];
      if ($scope.colors.indexOf(product_color.color) == -1) { // always pushes the color even if the color is the same
        $scope.colors.push(product_color.color);
      }
    }
  }
}

是否有另一种方法来查看对象是否存在于数组中?

你可以使用angular。等于(obj1, obj2)对对象进行深度比较。

试试这样写:

// do your data munging:
$scope.colors = [];
for (var i = 0,
         dataLength = data.length; i < dataLength; i++) {
    var product = data[i];
    for (var j = 0,
             colorsLength = product.products_colors.length; j < colorsLength; j++) {
      var product_color =  product.products_colors[j];
      // loop through your color array and check objects. 
      for(var k = 0,
          scopeColorsLength = $scope.colors.length; k < scopeColorsLength; k++){
          if (angular.equals(product_color.color, $scope.colors[k])) {
            $scope.colors.push(product_color.color);
          }
       }
    }
}

你不能只比较对象，你需要比较对象的特定属性:

$scope.colors = []; // empty array
$scope.setFilterChoices = function(data) {
  for (var i = 0; i < data.length; i++) {
    var product = data[i];
    for (var j = 0; j < product.products_colors.length; j++) {
      var product_color = product.products_colors[j];
      var contains = false;
      for (var k = 0; k < $scope.colors.length; k++) {
          if (angular.equals($scope.colors[k], product_color.color)) {
            contains = true;
            break;
          }
        }
      }
      if (!contains) {
        $scope.colors.push(product_color.color);
      }
    }
  }
}
相关文章：