angularjs 过滤多维对象 json [英] angularjs filter multidimensional object json

问题描述

我不想使用 ng-repeat 来显示按对象值过滤的列表.这是我的尝试 https://plnkr.co/edit/vD4UfzM4Qg7c0WGTeY18?p=preview

I wnt to use ng-repeat to display a list filtered by an object value. Here is a plukr of my attempt https://plnkr.co/edit/vD4UfzM4Qg7c0WGTeY18?p=preview

以下内容按预期返回了我的所有 JSON names.

The following returns all of my JSON names as expected.

<li ng-repeat="item in collection_data">{{navitem.name}}</li>

现在我想过滤并只显示具有 "foreign_lang": "es", 的项目的名称，就像这个 json 片段

now i want to filter and only show the names of the items that have "foreign_lang": "es", like in this json snippet

  {
    "id": "ddb06ba2-6348-4d45-9e63-a6fa3632e5c2",
    "created_at": "2015-10-12T18:34:15.668Z",
    "updated_at": "2016-04-14T15:55:37.433Z",
    "custom_attributes": {
      "Display Name": "Activos en Español",
      "foreign_lang": "es",
      "display_boxes": "false"
    },
  },

所以我做了这个过滤功能

so i made this filter function

$scope.filterByDisplay = function() {
  $filter('filter')($scope.collection_data, ['foreign_lang', 'es']);
}

并这样称呼它.

<li ng-repeat="item in collection_data"  | filter: filterByDisplay>{{navitem.name}}</li>

我没有收到任何控制台错误，但我没有收到任何返回.

I did not get any console errors but i got nothing returned.

如何正确过滤此集合以仅返回带有 'foreign_lang', 'es' 作为 json 值的项目?请参阅 plunkr 以查看工作示例 https://plnkr.co/edit/vD4UfzM4Qg7c0WGTeY18?p=预览

How do I properly filter through this collection to only return items with 'foreign_lang', 'es' as a value in the json? See the plunkr to see a working example https://plnkr.co/edit/vD4UfzM4Qg7c0WGTeY18?p=preview

推荐答案

第三次尝试(因为问题被修改).使用过滤器函数单独检查每个对象，只返回通过真值测试的对象.

Third attempt (since the question was revised). Use the filter function to check each object individually, and returning only those that pass the truth test.

$scope.filterByDisplay = function(value) {
  return (value.content)
      && (value.content.custom_attributes) 
      && (value.content.custom_attributes.foreign_lang === "es");
}

更新的 Plunk - 使用过滤功能

这篇关于angularjs 过滤多维对象 json的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！