Question

var foo = [
    {
        "id": 12,
        "name": "Test"
    },
    {
        "id": 2,
        "name": "Beispiel"
    },
    {
        "id": 3,
        "name": "Sample"
    },
    {
        "id": 4,
        "name": "Test"
    },
    {
        "id": 5,
        "name": "Sample value"
    },
    {
        "id": 6,
        "name": "Testvalue"
    }
];

我正在尝试获取一个简单的搜索输入，其中显示了几个关于ng-repeat的列表。搜索基本上是一个过滤器，显示该列表中的搜索项目。我所取得的成就是当我用$ http搜索某些东西时，它会返回整个foo列表，并在其中过滤掉。如何使用我的关键字和整个JSON获取数据？例如，如果我搜索样本，我如何获取id 3和5的对象，以便我可以显示一组新的列表，或者如果我使用ID号12搜索，我得到id为12的对象。术语将是动态的。我也将在每次搜索时拨打$ http电话。

感谢。

Answer 1

您可以使用$ filter来实现此目的。

function YourController($filter) {

var result = $filter('filter')(foo, {"id":3,"id":5});

};

您可以稍后迭代结果。

Answer 2

如果我理解得很好，它应该有效：

＆＃13;

(function() {
  angular
    .module('app', [])
    .controller('MainCtrl', MainCtrl);

  MainCtrl.$inject = ['$scope', '$http'];

  function MainCtrl($scope, $http) {
    $scope.foo = [  
       {  
          "id":12,
          "name":"Test"
       },
       {  
          "id":2,
          "name":"Beispiel"
       },
       {  
          "id":3,
          "name":"Sample"
       },
       {  
          "id":4,
          "name":"Test"
       },
       {  
          "id":5,
          "name":"Sample value"
       },
       {  
          "id":6,
          "name":"Testvalue"
       }
    ];
  }
})();

＆＃13;

<!DOCTYPE html>
<html ng-app="app">

<head>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script>
</head>

<body ng-controller="MainCtrl">
  <input type="text" ng-model="search" placeholder="Search">
  <ul>
    <li ng-repeat="item in foo | filter: search">
      <span ng-bind-template="{{item.id}} - {{item.name}}"></span>
    </li>
  </ul>
</body>

</html>

＆＃13;

注意：如果您想根据搜索 $http执行input请求，请查看此DEMO。< / p>

如何使用AngularJS中的过滤器返回具有特定值的对象数组？

2 个答案: