116

在 Angular 中,我在范围内有一个返回大量对象的对象。每个都有一个 ID(它存储在一个平面文件中,所以没有数据库,我似乎无法使用ng-resource

在我的控制器中:

$scope.fish = [
    {category:'freshwater', id:'1', name: 'trout', more:'false'},
    {category:'freshwater', id:'2', name:'bass', more:'false'}
];

在我看来,我有更多关于默认隐藏的鱼的附加信息ng-show,但是当我单击简单的显示更多选项卡时,我想调用该函数showdetails(fish.fish_id)。我的函数看起来像:

$scope.showdetails = function(fish_id) {  
    var fish = $scope.fish.get({id: fish_id});
    fish.more = true;
}

现在在视图中显示了更多详细信息。但是,在搜索完文档后,我无法弄清楚如何搜索该fish数组。

那么如何查询数组呢?在控制台中我如何调用调试器以便我有$scope对象可以玩?

4

7 回答 7

211

您可以使用现有的 $filter 服务。我更新了上面的小提琴http://jsfiddle.net/gbW8Z/12/

 $scope.showdetails = function(fish_id) {
     var found = $filter('filter')($scope.fish, {id: fish_id}, true);
     if (found.length) {
         $scope.selected = JSON.stringify(found[0]);
     } else {
         $scope.selected = 'Not found';
     }
 }

Angular 文档在这里http://docs.angularjs.org/api/ng.filter:filter

于 2013-09-27T06:29:30.337 回答
95

我知道这是否可以帮助你一点。

这是我试图为你模拟的东西。

签出 jsFiddle ;)

http://jsfiddle.net/migontech/gbW8Z/5/

创建了一个您也可以在“ng-repeat”中使用的过滤器

app.filter('getById', function() {
  return function(input, id) {
    var i=0, len=input.length;
    for (; i<len; i++) {
      if (+input[i].id == +id) {
        return input[i];
      }
    }
    return null;
  }
});

在控制器中的用法:

app.controller('SomeController', ['$scope', '$filter', function($scope, $filter) {
     $scope.fish = [{category:'freshwater', id:'1', name: 'trout', more:'false'},  {category:'freshwater', id:'2', name:'bass', more:'false'}]

     $scope.showdetails = function(fish_id){
         var found = $filter('getById')($scope.fish, fish_id);
         console.log(found);
         $scope.selected = JSON.stringify(found);
     }
}]);

如果有任何问题,请告诉我。

于 2013-03-25T09:01:54.793 回答
22

要添加到@migontech 的答案以及他的地址,他的评论是您可以“可能使其更通用”,这是一种方法。下面将允许您按任何属性进行搜索:

.filter('getByProperty', function() {
    return function(propertyName, propertyValue, collection) {
        var i=0, len=collection.length;
        for (; i<len; i++) {
            if (collection[i][propertyName] == +propertyValue) {
                return collection[i];
            }
        }
        return null;
    }
});

然后对过滤器的调用将变为:

var found = $filter('getByProperty')('id', fish_id, $scope.fish);

请注意,我删除了一元(+)运算符以允许基于字符串的匹配...

于 2013-10-03T21:33:21.913 回答
13

一个肮脏而简单的解决方案可能看起来像

$scope.showdetails = function(fish_id) {
    angular.forEach($scope.fish, function(fish, key) {
        fish.more = fish.id == fish_id;
    });
};
于 2013-03-25T09:09:41.607 回答
7

Angularjs 已经有过滤选项来做到这一点, https: //docs.angularjs.org/api/ng/filter/filter

于 2015-03-08T09:16:27.287 回答
7

您的解决方案是正确的,但不必要的复杂。您可以使用纯 javascript 过滤功能。这是你的模型:

     $scope.fishes = [{category:'freshwater', id:'1', name: 'trout', more:'false'},  {category:'freshwater', id:'2', name:'bass', more:'false'}];

这是你的功能:

     $scope.showdetails = function(fish_id){
         var found = $scope.fishes.filter({id : fish_id});
         return found;
     };

您还可以使用表达式:

     $scope.showdetails = function(fish_id){
         var found = $scope.fishes.filter(function(fish){ return fish.id === fish_id });
         return found;
     };

有关此功能的更多信息:LINK

于 2016-07-20T14:45:47.647 回答
4

看到这个帖子,但我想搜索与我的搜索不匹配的 ID。执行此操作的代码:

found = $filter('filter')($scope.fish, {id: '!fish_id'}, false);
于 2016-09-19T11:14:59.393 回答