Comment filtrer (clé, valeur) avec ng-repeat dans AngularJs?

Les filtres angulaires ne peuvent être appliqués qu'aux tableaux et non aux objets, à partir de l'API angulaire –

"Sélectionne un sous-ensemble d'éléments du tableau et le renvoie comme un nouveau tableau".

Vous avez deux options ici:
1) déplacer $scope.items vers un tableau ou –
2) préfiltrer les éléments ng-repeat , comme ceci:

 <div ng-repeat="(k,v) in filterSecId(items)"> {{k}} {{v.pos}} </div> 

Et sur le contrôleur:

 $scope.filterSecId = function(items) { var result = {}; angular.forEach(items, function(value, key) { if (!value.hasOwnProperty('secId')) { result[key] = value; } }); return result; } 

Jsfiddle : http://jsfiddle.net/bmleite/WA2BE/

Ma solution serait créer un filtre personnalisé et l'utiliser:

 app.filter('with', function() { return function(items, field) { var result = {}; angular.forEach(items, function(value, key) { if (!value.hasOwnProperty(field)) { result[key] = value; } }); return result; }; }); 

Et en html:

  <div ng-repeat="(k,v) in items | with:'secId'"> {{k}} {{v.pos}} </div> 

Ou tout simplement utiliser

 ng-show="v.hasOwnProperty('secId')" 

Voir la solution mise à jour ici:

http://jsfiddle.net/RFontana/WA2BE/93/

Vous pouvez également utiliser ng-repeat avec ng-if :

 <div ng-repeat="(key, value) in order" ng-if="value > 0"> 

Vous pouvez simplement utiliser le module angular.filter , puis vous pouvez filtrer même par des propriétés imbriquées.
Voir: jsbin
2 Exemples:

JS:

 angular.module('app', ['angular.filter']) .controller('MainCtrl', function($scope) { //your example data $scope.items = { 'A2F0C7':{ secId:'12345', pos:'a20' }, 'C8B3D1':{ pos:'b10' } }; //more advantage example $scope.nestedItems = { 'A2F0C7':{ details: { secId:'12345', pos:'a20' } }, 'C8B3D1':{ details: { pos:'a20' } }, 'F5B3R1': { secId:'12345', pos:'a20' } }; }); 

HTML:

  <b>Example1:</b> <p ng-repeat="item in items | toArray: true | pick: 'secId'"> {{ item.$key }}, {{ item }} </p> <b>Example2:</b> <p ng-repeat="item in nestedItems | toArray: true | pick: 'secId || details.secId' "> {{ item.$key }}, {{ item }} </p> 

C'est un peu tard, mais j'ai cherché un filtre similaire et j'ai fini par utiliser quelque chose comme ça:

 <div ng-controller="TestCtrl"> <div ng-repeat="(k,v) in items | filter:{secId: '!!'}"> {{k}} {{v.pos}} </div> </div> 

J'ai fait un peu plus un filtre générique que j'ai déjà utilisé dans plusieurs projets:

• Object = l'objet qui doit être filtré
• Champ = champ dans cet objet sur lequel nous filtrons
• Filter = la valeur du filtre qui doit correspondre au champ

HTML:

 <input ng-model="customerNameFilter" /> <div ng-repeat="(key, value) in filter(customers, 'customerName', customerNameFilter" > <p>Number: {{value.customerNo}}</p> <p>Name: {{value.customerName}}</p> </div> 

JS:

  $scope.filter = function(object, field, filter) { if (!object) return {}; if (!filter) return object; var filteredObject = {}; Object.keys(object).forEach(function(key) { if (object[key][field] === filter) { filteredObject[key] = object[key]; } }); return filteredObject; };