AngularJS用对象数组归档嵌套的对象数组答案

【问题标题】：AngularJS Filed nested array of objects with array of objectsAngularJS用对象数组归档嵌套的对象数组
【发布时间】：2017-04-03 16:35:20
【问题描述】：

我正在尝试通过 idSubject 用我自己的对象过滤嵌套的对象数组。但我没有得到正确的结果。

我有文章（有主题）和一组对象（这是我要过滤文章的主题）

数据如下所示：

所以我试图按主题过滤文章数组。

我尝试了以下方法：

<div class="panel panel-default"
                     ng-repeat="searchArticle in searchArticles | filter: {subjects: filterSubjects} as articleSearchResult">

所以 filterSubjects 是第二个屏幕截图，SearchArticles 是第一个屏幕截图。

运气不好。

希望您能提供帮助，如果事情仍然不清楚，请告诉我。

【问题讨论】：

您需要为此创建一个自定义过滤器并自己进行匹配
@charlietfl 有什么例子吗？我尝试了几次，但都失败了。
所有名称值都是唯一的吗？如果是这样，我会创建一个使用这些值作为键的对象，然后在过滤中检查迭代主数组时该属性是否存在
@charlietfl 没有。只有 idSubject。这也是我要过滤的唯一属性。我希望能够检查一些复选框，然后过滤文章的主题。 idSubject 是唯一的。
原理相同...从filterSubjects中提取所有ID，然后检查何时迭代searchArticles

标签： angularjs arrays object filter compare

【解决方案1】：

此自定义过滤器将为您提供帮助。

例如：http://plnkr.co/edit/jMizCLxPH6DtDA5wL15Q?p=preview

HTML：

<body ng-app="myApp">
  <div ng-controller="MainCtrl">
<h2>Select Subjects</h2>
    <div ng-repeat="subject in subjects">
      <label>
        <input type="checkbox" ng-model="filterSubjects[subject.id]" ng-true-value="'{{subject.id}}'" ng-false-value="''">{{subject.name}}</label>
    </div>

    <h2>Filtered Articles</h2>

    <div ng-repeat="searchArticle in searchArticles | subjectFilter:filterSubjects">{{searchArticle.name}}</div>
  </div>
</body>

JS：

var app = angular.module('myApp', []);

app.controller('MainCtrl', function($scope) {
  $scope.searchArticles = [{
    "name": "Article1",
    "sid": "1"
  }, {
    "name": "Article2",
    "sid": "1"
  }, {
    "name": "Article3",
    "sid": "2"
  }];
  $scope.subjects = [{
    "name": "Subject1",
    "id": "1"
  }, {
    "name": "Subject2",
    "id": "2"
  }];
  $scope.filterSubjects = [];

});

app.filter('subjectFilter', function() {
  return function(articles, filterSubjects) {
    filtered = articles.filter(function(e){return filterSubjects.indexOf(e.sid) >= 0},filterSubjects);
    return filtered;
  }
});

如果要根据对象进行过滤：

var app = angular.module('myApp', []);

app.controller('MainCtrl', function($scope) {
  $scope.searchArticles = [{
    "name": "Article1",
    "sid": "1"
  }, {
    "name": "Article2",
    "sid": "1"
  }, {
    "name": "Article3",
    "sid": "2"
  }];
  $scope.subjects = [{
    "name": "Subject1",
    "id": "1"
  }, {
    "name": "Subject2",
    "id": "2"
  }];
  $scope.filterSubjects = [{
    "name": "Subject1",
    "id": "1"
  }, {
    "name": "Subject1",
    "id": "2"
  }];

});

app.filter('subjectFilter', function() {
  return function(articles, filterSubjects) {
    var sFiltered = [];
    for (var i = 0; i < filterSubjects.length; i++) {
      sFiltered.push(filterSubjects[i].id);
    }
    var filtered = articles.filter(function(e) {
      return sFiltered.indexOf(e.sid) >= 0;
    }, sFiltered);
    return filtered;
  }
});

【讨论】：

它让我朝着正确的方向前进，但是您的数据模式有一个 sid，而不是像我这样的对象数组。我将如何处理对象数组？感谢您的回复。
@TVH7 你说 filterSubjects 将是 object 数组，如果是这样你想写循环来找到匹配的。
filterSubjects 确实是一个“主题”数组，一篇文章也有一个主题对象数组。所以我想按主题数组过滤文章。假设我选择了主题 1 和 2，那么我只想查看其对象数组中包含主题 1 和 2 的文章。
@TVH7 我已经更新了我对您的对象过滤条件的回答，如果它没有帮助，您可以创建一个示例来显示您的问题，以便我可以帮助您。