Question

我希望按类别和位置使用AngularJS过滤以下列表。我遇到的困难是在过滤发生后能够将结果正确地嵌套在各自的类别下（见下文）。

var jobs = [
    {
        title: "Software Engineer",
        category: "Engineering",
        location: "New York"
    },
    {
        title: "Web Developer",
        category: "Engineering",
        location: "Chicago"
    },
    {
        title: "UX Designer",
        category: "Design",
        location: "New York"
    }
]

这是所需的输出（还要注意按字母顺序排列的类别）：

设计
UX Designer

工程
软件工程师
Web开发人员

非常感谢任何帮助。谢谢！

Answer 1

你脑子里有这样的事情吗？

  <b>Design</b>
  <ul>
      <li ng-repeat="job in jobs | filter: { category:'Design'}">
        {{job.title}}
      </li>
  </ul>
  <b>Engineering</b>
  <ul>
      <li ng-repeat="job in jobs | filter: { category:'Engineering'}">
        {{job.title}}
      </li>
  </ul>

有工作JSFiddle。

Answer 2

我会重新构建我的JSON，如下所示：

  $scope.parsedJobs = [];
  angular.forEach($scope.jobs, function(value, key) {
    var j = $scope.parsedJobs.filter(function(element) {
      return element.category == value.category;
    });
    if (j.length > 0) {
      $scope.parsedJobs[0].elements.push({
        title: value.title, 
        location: value.location
      });
    } else {
      $scope.parsedJobs.push({
        category: value.category,
        elements: [{
          title: value.title, 
          location: value.location
        }]
      });
    }
  });

Fiddle

Answer 3

以下是使用AngularJS Group By Directive without External Dependencies过滤器解决方案的plnkr数据的工作示例：

http://plnkr.co/edit/w5UJUN?p=preview

使用AngularJS进行高级过滤

3 个答案: