Question

我目前想制作一个可以比较产品及其价格的系统并列出它们。

我找到了一种使用AngularUI的唯一过滤器在AngularJS中过滤重复产品的方法。我有两个JSON文件，每个文件都填充了两个不同提供商的产品。

但我不希望它删除副本我想要找回类似产品的列表，这样有人可以比较价格并选择他最喜欢的产品提供商。

如果我使用唯一过滤器运行ng-repeat，它只会删除重复项。有比较过滤器吗？

Answer 1

为了做你想做的事，你需要编写一个自定义过滤器来进行比较，并根据你的定义确定两个对象是否相似。像这样的东西。这是一个plunk：

var app = angular.module('app', [])
  .filter('similar', function() {
    return function(input, comparedObject) {
      console.log(comparedObject);
      var newArray = [];
      for (i = 0; i < input.length; i++) {
        if (input[i].itemType === comparedObject.itemType) {
          newArray.push(input[i]);
        }
      }
      return newArray;
    }
  });

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';
  $scope.baseObject = {
    name: 'fred',
    itemType: 1
  };
  $scope.castList = [
    {
      name: 'wilma',
      itemType: 2
    }, 
    {
      name: 'bam-bam',
      itemType: 1
    }, 
    {
      name: 'barney',
      itemType: 1
    }, 
    {
      name: 'dino',
      itemType: 3
    }
  ];
});

然后在视图的HTML中需要这样的东西。

<body ng-app="app">
    <div ng-controller="SomeCtrl">
        <div ng-repeat="person in castList | similar : baseObject">
            <p>{{person.name}}</p>
        </div>
    </div>
</body>

请注意，视图中过滤器中引用的“baseObject”是在控制器的作用域中定义的。

此自定义过滤器根据对象的“itemType”属性进行比较，在我的示例中，该属性只是一个数字。您必须重新编写过滤器以根据您的需要进行比较。所以你得到的只是那些itemType属性为1的对象的显示，它与baseObject的相同。

AngularJS如何比较ng-repeat中的类似对象

1 个答案: