如何使用orderBy並使用對象（而不是數組）過濾ng-repeat？

Question

我有數據“喜歡”這個：

$scope.persons = {
        "ID123": {
            name_de: "Andre",
            name_en: "Anrew",
            age: 30,
            description: "He is the father of xyz and . . .",

             . . .

        },
        "IDabc": {
            name_de: "Markus",
            name_en: "Mark",
            age: 20,

             . . .
        },
        "IDxyz": {
            name_de: "Isaak",
            name_en: "Isaac",
            age: 23,

             . . .
        }

    . . .

}

我有一個輸入/ ng-repeat：

<input ng-model="query" placeholder="Suche . . .">
<ul>
    <li ng-repeat="p in persons | orderBy:'name_de' | filter:query"> Some output here . . . </li>
</ul>

現在問題是如何訂購和過濾這個？

它與一群人合作 ，但我需要“ID”，所以對象是必要的！？

我正在尋找一種通過N屬性過濾對象的方法，例如對於name_de和name_en（如果我搜索安德烈，如果我搜索安德魯，它將顯示ID123）但忽略“描述”的文本（第一個我有過濾器檢查所有屬性的問題）

Answer 1

你可以使用toArrayfilter模塊更多信息，請看這里： http ：//ngmodules.org/modules/angular-toArrayFilter

並為您的解決方案提供示例演示http://jsbin.com/nimoxa/1/edit JS：

angular.module('angular-toArrayFilter', [])

.filter('toArray', function () {
  return function (obj, addKey) {
    if (!(obj instanceof Object)) {
      return obj;
    }

    if ( addKey === false ) {
      return Object.values(obj);
    } else {
      return Object.keys(obj).map(function (key) {
        return Object.defineProperty(obj[key], '$key', { enumerable: false, value: key});
      });
    }
  };
});

var app = angular.module('app', ['angular-toArrayFilter']);

app.controller('firstCtrl', function($scope){

  $scope.persons = {

    "IDabc": {
            name_de: "Markus",
            name_en: "Mark",
            age: 20,


        },
        "ID123": {
            name_de: "Andre",
            name_en: "Anrew",
            age: 30,
            description: "He is the father of xyz and . . .",



        },

        "IDxyz": {
            name_de: "Isaak",
            name_en: "Isaac",
            age: 23,


        }   

};

});

HTML：

body ng-app="app">
  <div ng-controller="firstCtrl">
<input ng-model="query" placeholder="Suche . . .">
<ul>
    <li ng-repeat="p in persons | toArray | orderBy:'age' | filter:query"> {{p.name_de}} -> {{p.name_en}} </li>
</ul>
      </div>
</body>

Answer 2

回答你的問題

它與一群人合作，但我需要“ID”，所以對象是必要的！？

你可以將ID作為你人物的屬性包含在內，以便它們看起來像這樣嗎？

$scope.persons = [
    { id: "ID123",
      name_de: "Andre",
      name_en: "Anrew",
      age: 30,
      description: "He is the father of xyz and . . .",
      . . .
    },
    { id: "IDabc",
      name_de: "Markus",
      name_en: "Mark",
      age: 20,
    },
         . . .
];

要按name_de和name_en（或任何其他屬性）進行搜索，您可以嘗試編寫自定義過濾器。 這很容易。

var app = angular.module("YourApp");
app.filter('MyCustomFilter', function(){
    return function(objects, criteria){
        if(!criteria)            
            return objects;

        var filterResult = new Array();
        for(var index in objects)
            if(objects[index].name_de.indexOf(criteria) != -1 || objects[index].name_en.indexOf(criteria) != -1)
                filterResult.push(objects[index]);
        return filterResult;
    }
});

您的HTML將如下所示：

<input type="text" data-ng-model="personFilter" />
<div data-ng-repeat="person in persons | MyCustomFilter:personFilter"> ... </div>