javascript - 对象中嵌套数组的 Angular ng-repeat 过滤器

Question

我正在尝试基于嵌套数组在 ng-repeat 中应用过滤器。用于 ng-repeat 的对象:

已更新

主数组:

   {
  "0": {
    "Employee_Id": "hni",
    "comptencies": [
      {
        "Title": "Bunker Knowledge",
        "Level": 1
      },
      {
        "Title": "Bunker Knowledge",
        "Level": 3
      },
      {
        "Title": "IT Compliance",
        "Level": 2
      },
      {
        "Title": "Bunker Knowledge",
        "Level": 5
      }
    ],
  }
}

JS:

$scope.myFilter = {
    competencyTitle : ""
}

HTML:

<label>Competencies
<select ng-model="myFilter.competencyTitle" ng-options="item.Title for item in competencies_list"></select>
</label>


<tr ng-repeat="item in master_array | filter: { competencies: [{ Competency.Title: myFilter.competencyTitle }] }">

上面的方法不起作用。

案例

我有一个员工列表，每个员工都有一个 ID 和附加的能力数组。该数组中的每个项目都附加了一个能力数组，其中包含标题和能力的 ID。我想要的是能够过滤掉具有特定能力的员工。

有什么建议吗？

Answer 1

我找到了解决方案。您可能必须使其适应您的特定代码:

主要思想是这样的:filter: { $: {Title: myFilter.competencyTitle.Title} }

$ 选择其子级为 Title 的任何元素。

html

<label>Competencies {{myFilter.competencyTitle.Title}}
    <select ng-model="myFilter.competencyTitle" ng-options="item.Title for item in competencies_list"></select>
</label>


<p ng-repeat="item in master_array | filter: {  $: {Title: myFilter.competencyTitle.Title}  }">{{item.employee_id}} {{item.competencies}}    </p>

js - 这是使用的模型，我不确定这是否反射(reflect)了您的实际模型。

$scope.competencies_list = [{Title : "Math"},{Title : "English"},{Title : "Spanish"}];

$scope.master_array = 
[
    {         
        employee_id: "hni",         
        competencies:
            [
                {Title : "Math", "Level": 1},
                {Title : "English", "Level": 2}           
            ]
    }, 
    {
        employee_id: "xyz",         
        competencies:
            [
                {Title : "Spanish", "Level": 3},
                {Title : "English", "Level": 5}           
            ]
    }
];

$scope.myFilter = {
    competencyTitle : ""
};