Comment appliquer un filtre sur plusieurs objets en utilisant AngularJS?

J'ai de l'utilisateur de l'objet défini comme ci-dessous.

$scope.users = [{id: 1, name: 'Adam', friends: [{name: 'John', age: 21, sex: 'M'}, {name: 'Brad', age: 32, sex: 'M'}]}]

Puis-je avoir le code suivant:

<div ng-repeat="user in users>
 <input type="text" ng-model="searchText">
 <div ng-repeat="friend in user.friends | filter:searchText">
  {{user.name}} {{friend.name}} {{friend.age}}
 </div>
</div>

Maintenant quand je tape dans la zone de texte le texte: "texterecherché', je veux le filtre pour afficher le nom de l'utilisateur et le nom et l'âge de l'ami. Quelqu'un peut m'aider avec la façon de faire cela?

Si je suis correct, je pense que j'ai besoin de créer un filtre personnalisé pour cela ou est-il un autre moyen que je peux accomplir cela?

OriginalL'auteur Sabarish Sankar | 2012-12-12

  1. 14

    Parce que vous voulez filtrer sur deux choses à la fois certaines propriétés des amis de tableau et également à l'utilisateur -- vous aurez besoin pour créer vos propres filtre personnalisé qui accepte 2 paramètres supplémentaires:

    myApp.filter('myFilter', function() {
  return function(friends, searchText, username) {
    var searchRegx = new RegExp(searchText, "i");
    if ((searchText == undefined) || (username.search(searchRegx) != -1)) {
        return friends;
    }
    var result = [];
    for(i = 0; i < friends.length; i++) {
        if (friends[i].name.search(searchRegx) != -1 || 
            friends[i].age.toString().search(searchText) != -1) {
            result.push(friends[i]);
        }
    }
    return result;
  }
});

    Ensuite l'appeler de la sorte:

    <div ng-repeat="user in users">
   <input type="text" ng-model="searchText">
   <div ng-repeat="friend in user.friends | myFilter:searchText:user.name">
      {{user.name}} {{friend.name}} {{friend.age}}
    </div>
</div>

    ":texterecherché:l'utilisateur.name" est le chemin, vous traverserez des arguments supplémentaires à un filtre personnalisé.

    Violon.

    Merci beaucoup Marque! Mais ce filterFilter(amis, texterecherché) filtre sur tous les objets d'amis que j'ai.e, le nom, l'âge et le sexe, ou autre, seulement le nom et l'âge. Mon exigence est que je veux seulement " nom " et " âge " pour les recherches et les résultats de filtrer uniquement sur ces deux objets d'amis, ce sont ceux des champs arriver affiché et non pas sur le 'sexe'
    Voir mise à jour de réponse.
    Je me rends compte à quel âge c'est... mais ce qui se passe lors de mon entrée "texterecherché' est toujours pas défini à l'intérieur du filtre? La portée des questions, évidemment, mais pourquoi?
    Je vous suggère de créer une nouvelle question qui comprend votre code HTML et le filtre.
    est un RegExp drapeau que signifie "ignorer la casse".

    OriginalL'auteur Mark Rajcok

  2. 1

    http://docs.angularjs.org/api/ng.filter:filter

    <div ng-repeat="user in users>
 <input type="text" ng-model="search.$">
 <div ng-repeat="friend in user.friends | filter:search">
  {{user.name}} {{friend.name}} {{friend.age}}
 </div>
</div>
    Grâce fastreload! Cette aide! Mais quelles sont l'objet de ce filtre? Sera-ce filtre que sur nom d'utilisateur et nom de l'ami et de l'âge?
    Comme décrit dans la documentation, il faut chercher toutes les propriétés d'un objet à l'intérieur d'un tableau d'objets. Vous pouvez penser $ comme une magie générique.
    Grâce fastreload! Ici, dans mon ami de l'objet j'ai trois attributs: nom, l'âge et le sexe. Mais je ne veux pas que le sexe puisse être consultée. Est-il un moyen que je peux accomplir cela?
    Vous avez besoin de créer une fonction qui prend un élément dans le tableau et le résultat vrai ou faux en fonction de vos besoins, et de passer le nom de la fonction en tant que filters paramètre. "fonction: Une fonction de prédicat peut être utilisé pour écrire arbitraires des filtres. La fonction est appelée pour chaque élément du tableau. Le résultat final est un tableau de ces éléments que le prédicat est retourné véritable."

    OriginalL'auteur Umur Kontacı