Angularjs过滤器不适用于json数据答案

【问题标题】：Angularjs filter isn't working with json dataAngularjs过滤器不适用于json数据
【发布时间】：2014-09-26 16:23:57
【问题描述】：

我正在使用简单的 Angularjs 过滤器，您可以在其中借助输入过滤列表中的项目。我把代码放在这里http://plnkr.co/edit/6vDeOiGNGbblkCBOi8B7?p=previewFilter 确实按预期工作，但是如果我将数据从控制器移动到 json 然后像那样解析它

function($scope, $http) {
        $http.get('companies.json').success(function(data) {
         $scope.companies = data;
};

Json 数据在 ng-repeat 列表中呈现，但过滤器搜索不再起作用。如何使用 json 数据应用过滤器？

我还将我想使用的 json 文件添加到同一个 plunker。

【问题讨论】：

你的过滤器有什么问题？在我看来它工作得很好。
您传递的是一个大对象，而不是 Companies.json 中的数组

标签： json angularjs

【解决方案1】：

你的 json 文件是一个对象而不是一个数组。所以你最好把它改成一个数组，或者

myApp.controller('CompaniesController', ['$http', '$scope', 
  function($http,$scope) {
    $http.get('companies.json').success(function(data) {
        var companies = [];
        // make the object to an array
        for(var companyName in data) {
          companies.push(data[companyName]);
        }
         $scope.companies = companies;
    });
  }
]);

【讨论】：

【解决方案2】：

您可以使用angular.filter 模块的toArray 过滤器将其转换为数组。
用法： object | toArray: addKey[optional]

注意： 如果 addKey 设置为 true，过滤器还会将一个新属性 $key 附加到包含我们正在迭代的对象中使用的原始键的值以引用该属性。

示例：

  <input ng-model="model" type="text"/>
  <ul>
    <li ng-repeat="comp in companies | toArray | filter:model">
      {{ comp }}
    </li>
  </ul>

【讨论】：

谢谢，不知道这种可能性。我绝对应该更仔细地研究过滤器。