在 Angular js 中过滤来自 json 或服务器的数据答案

【问题标题】：Filter the Data from json or Server in angular js在 Angular js 中过滤来自 json 或服务器的数据
【发布时间】：2014-11-07 05:16:41
【问题描述】：

我有包含以下信息的 json 数据

[
{
"city":"Bangalore",
"dob":"04-Oct-2014",
"age":24,
"maritalStatus":"Single"
},
{
"city":"Bangalore",
"dob":"04-Oct-2014",
"age":24,
"maritalStatus":"Single"
},
{
"city":"Chennai",
"dob":"04-Oct-2014",
"age":24,
"maritalStatus":"Single"
}
]

此数据以列表格式显示

<ul class="userInfo">
<div   ng-repeat="user in users " >
  <li class="btn-default">
    <div class="userDetails">
      <div class="userPosition">{{user.city}}</div>
    </div>
  </li>
  </div>
</ul>

HTTP 请求期间

userDirectory.controller("userListControl", function($scope,$rootScope, $http)
        {

            $http.get('data/userData.json').success (function(data){
               $scope.users = data;
        var usersDb = TAFFY();
        usersDb.insert(data);
            });
    });

这里，数据来自 userData.json 文件。

我的问题是，

在加载页面之前。我将声明 city = "bangalore"。

所以基于城市。我必须显示基于城市的数据。我想避免来自json的城市：班加罗尔以外的其他数据。

如何过滤特定的城市数据。我不想使用过滤功能。我必须在这个阶段进行过滤

$scope.users = 数据；因为我在这里使用 JS Db。然后只有我可以将这些数据存储在这里并在将来处理

【问题讨论】：

可能重复：How to use a filter in a controller?

标签： javascript jquery json angularjs

【解决方案1】：

我不确定你的具体情况，但你可以做到

 $http.get('data/userData.json').success (function(data){
    var city='bangalore';   //can be set anywhere 
    $scope.users = data.filter(function(item){return item.city===city;});
    var usersDb = TAFFY();
    usersDb.insert($scope.users);
 });

Array.filter 适用于所有现代浏览器（即 9 及以上）

另外实现一个 Angular 过滤器并使用 $filter 服务在控制器中使用它：

【讨论】：

【解决方案2】：

是的，您可以像这样将 $filter 注入到您的控制器中：

userDirectory.controller("userListControl", function($scope,$rootScope, $http, $filter)
    {

        $http.get('data/userData.json').success (function(data){
           var cityFilter = {city: 'Bangalore'};

           $scope.users = $filter('filter')(data, cityFilter); //Then here is your result.
           var usersDb = TAFFY();
           usersDb.insert(data);
        });
});

Here is $filter document in angularjs.

【讨论】：