using angular.forEach in filter

Question

I have an array (1) with some id's and another array (2) with creatures, they have id (like in first array) and names. And I want to create new array (it will be looks like (1) id array, but only with id that in (2)). So I think that I need use filter.
(1)

$scope.main = ['dog', 'cat', 'bird', 'bug', 'human'];

(2)

  $scope.creatures = [
    {
      id: 'cat',
      name : 'fluffy'
    },
    {
      id: 'cat',
      name : 'mr.Kitty'
    },
    {
      id: 'human',
      name: 'Rachel'
    },
    {
      id: 'cat',
      name : 'Lucky'
    },
    {
     id: 'cat',
     name: 'Tom'
    }
    ];

filter:

  $scope.results = $scope.main.filter(function(item) {
    angular.forEach($scope.creatures, function(creature) {
      return item === creature.id;
    });
  });

I expect that it will be

$scope.results === ['cat', 'human'];

But I have

$scope.results // [0] empty array

Where I'm wrong? Plnkr example

it's happening because when you return in angular.forEach then it'll come out of scope at first time it and skips further. — Rakesh Chand
– Rakesh Chand, Commented Dec 9, 2016 at 11:38
May be, but not in all cases, you can filter creatures based on main — Rakesh Chand
– Rakesh Chand, Commented Dec 9, 2016 at 11:49

Supradeep · Accepted Answer · 2016-12-09 11:55:57Z

3

It is not working because you are returning in the first iteration itself inside forEach loop. You can get it working as shown below :

Updated Plunker

$scope.results = [];
$scope.main.filter(function(item) {
   angular.forEach($scope.creatures, function(creature) {
      if(item === creature.id){
       if( $scope.results.indexOf(item) === -1){
         $scope.results.push(item);
        }
      }
   });
});

Instead of looping again inside the filter, we can get the ids out of creatures array first and then filter them in main array like below :

 $scope.results = [];
 $scope.ids = $scope.creatures.map(function (creature){
   return creature.id;
 });


 $scope.ids.map(function (id){
   if($scope.main.indexOf(id) !== -1){
     if( $scope.results.indexOf(id) === -1){
       $scope.results.push(id);
     }
   }
 });
console.log($scope.results);

edited Dec 9, 2016 at 11:55

answered Dec 9, 2016 at 11:49

Supradeep

3,2661 gold badge18 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Arulkumar · Accepted Answer · 2016-12-09 12:24:54Z

Made few changes in your plunker, it is working now. Can you check with this code.

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

app.controller('Ctrl', function($scope, $timeout){
  $scope.main = ['dog', 'cat', 'bird', 'bug', 'human'];

  $scope.creatures = [
    {
      id: 'cat',
      name : 'fluffy'
    },
    {
      id: 'cat',
      name : 'mr.Kitty'
    },
    {
      id: 'human',
      name: 'Rachel'
    },
    {
      id: 'cat',
      name : 'Lucky'
    },
    {
     id: 'cat',
     name: 'Tom'
    }
    ];
    var array = [];
    $scope.call = function() {
    angular.forEach($scope.main,function(item){

    angular.forEach($scope.creatures, function(creature) {

      if(item == creature.id){
        // console.log('item',item,' creatureId',creature.id);
        if(array.indexOf(item) < 0 ){
          array.push(item);
        }

        console.log(array);
      }
    });
    $scope.results = array;
    });
  };

  $scope.call();
 console.log('result ',$scope.results);

});

Collectives™ on Stack Overflow

using angular.forEach in filter

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related