Fonction de filtre personnalisée AngularJS

Dans mon contrôleur, je voudrais filtrer un tableau d’objects. Chacun de ces objects est une carte pouvant contenir des chaînes ainsi que des listes

J’ai essayé d’utiliser le format $filter('filter')(array, function) mais je ne sais pas comment accéder aux éléments individuels du tableau dans ma fonction. Voici un extrait pour montrer ce que je veux.

 $filter('filter')(array, function() { return criteriaMatch(item, criteria); }); 

Et puis dans le criteriaMatch() , je vérifierai si chacune des propriétés individuelles correspond

 var criteriaMatch = function(item, criteria) { // go thro each individual property in the item and criteria // and check if they are equal } 

Je dois faire tout cela dans le contrôleur et comstackr une liste de listes et les définir dans la scope. Je n’ai donc besoin d’accéder au $filter('filter') cette façon. Tous les exemples que j’ai trouvés à ce jour dans le réseau ont des recherches de critères statiques dans la fonction, ils ne passent pas d’object de critère et ne testent pas chaque élément du tableau.

    Vous pouvez l’utiliser comme ceci: http://plnkr.co/edit/vtNjEgmpItqxX5fdwtPi?p=preview

    Comme vous l’avez trouvé, le filter accepte la fonction de prédicat qui accepte l’élément par élément du tableau. Il suffit donc de créer une fonction de prédicat en fonction des criteria donnés.

    Dans cet exemple, criteriaMatch est une fonction qui renvoie une fonction de prédicat qui correspond aux criteria donnés.

    modèle:

     
    {{ item }}

    scope:

     $scope.criteriaMatch = function( criteria ) { return function( item ) { return item.name === criteria.name; }; }; 

    Voici un exemple d’utilisation du filter dans votre JavaScript AngularJS (plutôt que dans un élément HTML).

    Dans cet exemple, nous avons un tableau d’enregistrements de pays, chacun contenant un nom et un code ISO à 3 caractères.

    Nous voulons écrire une fonction qui recherchera dans cette liste un enregistrement correspondant à un code à 3 caractères spécifique.

    Voici comment nous le ferions sans utiliser de filter :

     $scope.FindCountryByCode = function (CountryCode) { // Search through an array of Country records for one containing a particular 3-character country-code. // Returns either a record, or NULL, if the country couldn't be found. for (var i = 0; i < $scope.CountryList.length; i++) { if ($scope.CountryList[i].IsoAlpha3 == CountryCode) { return $scope.CountryList[i]; }; }; return null; }; 

    Oui, rien de mal à ça.

    Mais voici à quoi ressemblerait la même fonction, en utilisant le filter :

     $scope.FindCountryByCode = function (CountryCode) { // Search through an array of Country records for one containing a particular 3-character country-code. // Returns either a record, or NULL, if the country couldn't be found. var matches = $scope.CountryList.filter(function (el) { return el.IsoAlpha3 == CountryCode; }) // If 'filter' didn't find any matching records, its result will be an array of 0 records. if (matches.length == 0) return null; // Otherwise, it should've found just one matching record return matches[0]; }; 

    Beaucoup plus propre.

    Rappelez-vous que le filter retourne un tableau en tant que résultat (une liste d'enregistrements correspondants). Dans cet exemple, nous voulons soit retourner 1 enregistrement, soit NULL.

    J'espère que cela t'aides.

    De plus, si vous souhaitez utiliser le filtre de votre contrôleur comme vous le faites ici:

     
    {{ item }}

    Vous pourriez faire quelque chose comme:

     var filteredItems = $scope.$eval('items | filter:filter:criteriaMatch(criteria)');