javascript - 按 Angular.js 中的公共(public)对象属性过滤数组？

Question

几个小时以来，我一直在努力解决这个问题。情况是，我有一个应用程序以这种 JSON 格式接收有关人员的数据:

"people": [
      {
        "name": "Ivan",
        "city": "Moscow",
        "country": "Russia"
      },
      {
        "name": "John",
        "city": "Seattle",
        "country": "United States"
      },
      {
        "name": "Michael",
        "city": "Seattle",
        "country": "United States"
      }
    ]

我需要根据他们的城市将他们过滤到组中(显示在下拉列表中 <ul> s。即用户点击“西雅图”和 <li> 显示约翰和迈克尔。

如何做到这一点？

Answer 1

app.controller('FooCtrl', function($scope) {
   $scope.people = [
      {
        "name": "Ivan",
        "city": "Moscow",
        "country": "Russia"
      },
      {
        "name": "John",
        "city": "Seattle",
        "country": "United States"
      },
      {
        "name": "Michael",
        "city": "Seattle",
        "country": "United States"
      }
    ];
});

你可以像这样过滤它:

<div ng-repeat="person in people | filter:{ city: 'Seattle' }">

对于动态搜索:

<div ng-app="demo" ng-controller="FooCtrl"><input type="text" ng-model="search.city" >
  <ul>
     <li ng-repeat = "person in people | filter: search"> {{person.name}</li>
  </ul>
</div>

working example

如果您只使用搜索作为 ng-model，它将过滤整个对象。但是当我使用 search.city 时，它只过滤那个字段。