Question

我有一个产品JSON文件，JSON文件中的每个产品都有自己的一组标签（其中一些标签在其他产品中共享！）。我是否可以使用ng-repeat创建在数组中找到的标签列表，然后能够单击这些生成的标签，然后通过单击的标签过滤页面上的项目？每个属性应该只在列表中出现一次，不应该有重复的属性。这是可能的还是必须对滤波器进行硬编码？我对Angular还很新，所以不确定它的局限性。

Answer 1

创建一个函数来遍历所有产品中的所有属性，如果数组尚未存在，则将该属性添加到数组中。

$scope.getAttributes = function(){
  var attributes = [];
  angular.forEach($scope.data, function(item){
    angular.forEach(item.attributes, function(attribute){
      if(attributes.indexOf(attribute) == -1)
        attributes.push(attribute);
    })
  })
  return attributes;
}

现在，您可以在HTML中为这些属性创建标记列表：

<div ng-repeat="a in getAttributes()" ng-click="setFilter(a)">{{a}}</div>

单击属性将设置selectedAttribute变量，用于过滤产品列表：

<table>
    <tdata>
      <tr ng-repeat="d in data | filter:{attributes: selectedAttribute}">
        <td>{{d.name}}</td>
        <td>{{d.attributes}}</td>
      </tr>
    </tdata>
</table>

Plunker Demo

按类别的角度过滤角度

1 个答案: