Angularjs |搜索JsonArray以获取特定值

时间:2015-05-23 06:07:48

标签: arrays json angularjs

我尽可能简化了这一点。 我使用angularjs,我有一个带有json对象数组的控制器,如下所示:

controller('simpleC', function ($scope) {

  $scope.myArrayOfValues = [
    {
       "name" : "name1",
       "extra": "data"
    },
    {
       "name" : "name2",
       "extra": "data"
    },
    {
       "name" : "name3",
       "extra": "data"
    }
  ];
});

在我的html视图中,我想根据name的值快速从该数组中找到一个特定的json对象。显然我下面写的是错的,但结果却是我想要的。

<div ng-show="myArrayOfValues['name2']"></div>

我是否可以使用角度功能来避免我必须创建for循环或哈希映射?

2 个答案:

答案 0 :(得分:5)

您想使用filter。我们假设你有一个清单。

<ul>
  <li ng-repeat="item in myArrayOfValues">{{item.name}}</li>
</ul>

现在让我们假设您要使用完全匹配来搜索名称。

<input ng-model="search.name"><br>
<ul>
  <li ng-repeat="item in myArrayOfValues | filter:search:true">{{item.name}}</li>
</ul>

最后一个参数true是完全匹配的原因。对于不区分大小写的子字符串搜索,您可以关闭最后一个参数或将其设置为false。

答案 1 :(得分:2)

我认为创建过滤器的最佳方式

app.filter('getObj', [
    function() {
        return function(input,val) {
            var r,i;
            for(i; i<input.length;i++) {
                if (input[i].name === val) {
                   r = input[i];
                   break;
                }
            };
            return r;
        };
    }
]);

然后你可以这样使用它

<div ng-show="myArrayOfValues|getObj('name2')"></div>

或者只是以另一种方式格式化你的json,以你喜欢的方式使用它

  $scope.myArrayOfValues = {
       name1 :  {
           "name" : "name1",
           "extra": "data"
        },
        name2 : {
           "name" : "name2",
           "extra": "data"
        },
        name3 : {
           "name" : "name3",
           "extra": "data"
        }
      };

<div ng-show="myArrayOfValues['name2']"></div>

会正常工作。