0

i've checqued this : AngularJS filter based on array of strings?

But i've still got difficulties to know how to do :

My data model is this, they are footballers :

$scope.footballers = [
        {'identifiant':1,'prenom':'Jean','nom':'Valjean','categorie':1,'ville':'Détroit','age':12,'date_embauche':'','salaire':25,'photo':'1.jpg','vitesse':55,'agilite':3,'deduction':25,'choisi':false},
        {'identifiant':2,'prenom':'Aziz','nom':'Jojo','categorie':2,'ville':'Paris','age':14,'date_embauche':'','salaire':25,'vitesse':57,'agilite':31,'deduction':25,'choisi':false},
        {'identifiant':3,'prenom':'Thierry','nom':'Goubert','categorie':1,'ville':'Paris','age':17,'date_embauche':'','salaire':28,'photo':'2.jpg','vitesse':45,'agilite':3,'deduction':2,'choisi':false},
        {'identifiant':4,'prenom':'Roland','nom':'Grondin','categorie':2,'ville':'Paris','age':14,'date_embauche':'','salaire':25,'vitesse':5,'agilite':34,'deduction':2,'choisi':false},
        {'identifiant':5,'prenom':'Gogok','nom':'Rodolphe','categorie':1,'ville':'Paris','age':17,'date_embauche':'','salaire':28,'photo':'3.jpg','vitesse':68,'agilite':75,'deduction':2,'choisi':false},
        {'identifiant':6,'prenom':'Thierry','nom':'Chalamerto','categorie':1,'ville':'Paris','age':17,'date_embauche':'','salaire':28,'vitesse':55,'agilite':57,'deduction':75,'choisi':false},
        {'identifiant':7,'prenom':'Gawivk','nom':'Gonzogues','categorie':2,'ville':'Paris','age':14,'date_embauche':'','salaire':25,'vitesse':10,'agilite':44,'deduction':2,'choisi':false},
        {'identifiant':8,'prenom':'Thomas','nom':'Choubal','categorie':1,'ville':'Paris','age':12,'date_embauche':'','salaire':28,'vitesse':5,'agilite':3,'deduction':2,'choisi':false}
    ];

Now, I would like to display only the footballer who has the identifiant 2,3 and 8 for example.

Let's say I 've got this array :

var iwanttofilter = [2,3,8];

How could i do to filter with angularJs, firstly, in my ng-repeat, and secondly directly into my controller ?

Thank you.

Community
  • 1
  • 1
user7370387
  • 99
  • 2
  • 10

3 Answers3

2

In pure angular way

var filteredList = $filter('filter')($scope.footballers, function (i) {
  return (i.identifiant === 2 || i.identifiant === 3 || i.identifiant === 8);
});
Navoneel Talukdar
  • 4,393
  • 5
  • 21
  • 42
  • Thanks a lot, let's try this! – user7370387 Apr 11 '17 at 17:00
  • This is Exactly what i need, except that it doesn't pick values from the iwanttofilter array. how could i add a angular.foreach or a for loop inside the function to iterate over the iwanttofilter array ? – user7370387 Apr 11 '17 at 17:49
1

you can create a custom filter like this 

 .filter('cust',function(){
      var iwanttofilter = [2,3,8];
      return function(item){ 
         return item.filter(o=>iwanttofilter.find(k=> o.identifiant == k))        
      }
 })

in here array will filter according the iwanttofilter array and return the result

Demo

angular.module("app",[])
.controller("ctrl",function($scope){

$scope.footballers = [
        {'identifiant':1,'prenom':'Jean','nom':'Valjean','categorie':1,'ville':'Détroit','age':12,'date_embauche':'','salaire':25,'photo':'1.jpg','vitesse':55,'agilite':3,'deduction':25,'choisi':false},
        {'identifiant':2,'prenom':'Aziz','nom':'Jojo','categorie':2,'ville':'Paris','age':14,'date_embauche':'','salaire':25,'vitesse':57,'agilite':31,'deduction':25,'choisi':false},
        {'identifiant':3,'prenom':'Thierry','nom':'Goubert','categorie':1,'ville':'Paris','age':17,'date_embauche':'','salaire':28,'photo':'2.jpg','vitesse':45,'agilite':3,'deduction':2,'choisi':false},
        {'identifiant':4,'prenom':'Roland','nom':'Grondin','categorie':2,'ville':'Paris','age':14,'date_embauche':'','salaire':25,'vitesse':5,'agilite':34,'deduction':2,'choisi':false},
        {'identifiant':5,'prenom':'Gogok','nom':'Rodolphe','categorie':1,'ville':'Paris','age':17,'date_embauche':'','salaire':28,'photo':'3.jpg','vitesse':68,'agilite':75,'deduction':2,'choisi':false},
        {'identifiant':6,'prenom':'Thierry','nom':'Chalamerto','categorie':1,'ville':'Paris','age':17,'date_embauche':'','salaire':28,'vitesse':55,'agilite':57,'deduction':75,'choisi':false},
        {'identifiant':7,'prenom':'Gawivk','nom':'Gonzogues','categorie':2,'ville':'Paris','age':14,'date_embauche':'','salaire':25,'vitesse':10,'agilite':44,'deduction':2,'choisi':false},
        {'identifiant':8,'prenom':'Thomas','nom':'Choubal','categorie':1,'ville':'Paris','age':12,'date_embauche':'','salaire':28,'vitesse':5,'agilite':3,'deduction':2,'choisi':false}
    ];
    
    var iwanttofilter = [2,3,8];
    $scope.cust = function(){
      return function(item){
        return iwanttofilter.find(k=> item.identifiant == k)
      }
    }
    
})
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
 <div ng-repeat="item in footballers | filter:cust() track by $index ">{{item.identifiant}} </div>
</div>
Sachila Ranawaka
  • 39,756
  • 7
  • 56
  • 80
  • But the iwanttofilter array is inside the controller, not inside the filter, i dont know what to do. the iwanttofilter array values might change anytime. – user7370387 Apr 11 '17 at 17:54
0

You pass the iwanttofilter into the filter, and filter your list based on each item.

MyApp.filter("fewerFootballers", [
    function() {
        return function(footballers, iwanttofilter) {
            return arrayIntersection(footballers, iwanttofilter);

            function arrayIntersection(a, b) {
                return a.filter(function(x) {
                    return b.indexOf(x.identifiant) != -1;
                });
            }
        }
    }]);

In your html you use the filter.

{{ $scope.footballers | fewerFootballers: $scope.iwanttofilter }}
HaveSpacesuit
  • 3,572
  • 6
  • 40
  • 59