Angularjs 按子级筛选集合

我尝试过滤以下虚构对象：

{  
    "0":{  
        "boy":{  
            "age":"32",
            "name":"Daniel Grey"
        }
     },
     "1":{  
        "boy":{  
            "age":"23",
            "name":"John Doe"
         }
     }
}

然后，ng repeat指令如下所示：

<ul>
    <li ng-repeat="person in people">{{person.boy.name}}<li>
</ul>

{{person.boy.name}

我的问题是，我如何通过“姓名”过滤人们？我试过：

<input type="text" ng-model="name">
<ul>
    <li ng-repeat="person in people | filter:name">{{person.boy.name}}<li>
</ul>

{{{person.boy.name}

。。。但什么也没发生[ng模型似乎与视图断开连接！]

非常感谢您的回复

谢谢大家!

根据OP的更新更新答案

看看你的，

$scope.people

本质上是一个包含一个大JSON对象的数组，包含多个嵌套的

boy

对象。这很难处理。如果您可以控制JSON对象的构造，我建议您将其转换为一个包含多个JSON对象的数组，该数组可能如下所示：

$scope.people = [
    {
        "name":"Daniel Grey",
        "age":"32",
        "gender": "male"
    },
    {
        "name":"John Doe",
        "age":"23",
        "gender": "male"
    }
];

注意我是如何将

boy

键转换为

gender

属性的

如果您对数据结构完全没有控制权，那么您可能必须提出一个自定义过滤器来解析嵌套结构

看看这个。需要注意的几点：

我必须在

ng repeat

中指定

people[0]

，以检索数组中的一个大JSON对象

自定义的

nameFilter

仅搜索

.boy.name

属性

原始答案

如果只想按名称进行筛选，则必须在

ng model

指令中指定特定属性。因此，在你的情况下，它将是

<input type="text" ng-model="search.boy.name">
<ul>
    <li ng-repeat="person in people | filter:search">{{person.boy.name}}<li>
</ul>

{{{person.boy.name}

但首先需要修复

JSON

对象

更新：

---

现场演示。我确实注意到，仅按名称搜索过滤器不适用于angularjs 1.2.1，但适用于angularjs 1.2.2。

看起来很好

people

不是有效的JSON对象。我已经用我的应用程序中的实际结构更新了JSON对象。问题仍然存在：我如何通过“名字”过滤？@Alexandrupovici我已经在我的答案中添加了一个提琴。请试一试。非常感谢你努力帮助我。你很善良，我很感激你。我看过你的小提琴，的确，它很管用。然而，再看看我的JSON对象，这有点不同。我已经用新的结构更新了第一篇文章，你可以在这里看到：。还有一点需要注意：我使用的是angularjs v.1。3@AlexandruPopovici

“0”

、

“1”

等索引很复杂。您是否可以控制JSON对象的构造方式。如果是，您可以将其转换为数组，并将

boy

键更改为

gender:'male'

@alexandrupovici，否则，我们可能必须尝试使用自定义指令。