comparing array of objects in angularjs

Question

I have a following json(sample data) which i get from the another URL

var data = [
{ id: 1, name: 'ravi', parentid: 0 },
{ id: 2, name: 'raj', parentid: 1 },
{ id: 3, name: 'ram', parentid: 1 },
{ id: 4, name: 'raja', parentid: 0 },
{ id: 5, name: 'raju', parentid: 4 },       
{ id: 6, name: 'dinesh', parentid: 4 }  
];

When i get success message in angular, i want to compare data which has id of parentid zero with parentid of remaining data.I tried following code but i am not able to proceed more than this

$http.get('URL')
    .success(function(data) {
        var categories = data;
        for(var i =0;i<=categories.length;i++)
        {
            if(typeof categories[i] != "undefined" && categories[i].parentId == 0)
            {
                $scope.cat.push(categories[i]);
            }   
            if($scope.cat[i].parentid == categories[i].id)
            {
                $scope.content.push(categories[i]);
            }           
        }

    });

here i want to compare categories[i].parentId with $scope.cat.id and inserted into array but while comparing this i am getting an error like $scope.cat[i] is undefined finally my output look like below

Ravi
  raj
  ram
raja
  raju
  dinesh

i<=categories.length should be i<categories.length in your for loop — logee
– logee, Commented Aug 25, 2017 at 3:29
I don't see anywhere in your code where $scope.cat is defined. What is it supposed to be? — logee
– logee, Commented Aug 25, 2017 at 3:34
even i declared $scope.cat = [] at starting of code i am getting same error — vivek
– vivek, Commented Aug 25, 2017 at 3:41
i pushed data into $scope.cat but when i compared parentid and id i am getting this error — vivek
– vivek, Commented Aug 25, 2017 at 3:42

Sachet Gupta · Accepted Answer · 2017-08-25 05:58:34Z

1

I face 3 problems listed below:

In if(typeof categories[i] != "undefined" && categories[i].parentId == 0) you are comparing parentId and it never is as your property name is parentid (check casing). And hence, your 1st if loop is never executed and that is why your $scope.cat remains undefined.

Solution: correct the typo for parentId

In, if($scope.cat[i].parentid == categories[i].id) you are comparing the parent id of parent elements with id's of child element.

Solution: if($scope.cat[i].id == categories[i].parentid)

You are using same iterator for two list items with different lenghts.

Solution:

 var categories = data;

 // fill $scope.cat with elements having parent id = 0, so this list will contain all the parent elements
 $scope.cat = categories.filter(function(category) {
     return category && category.parentid === 0
 });
 $scope.content = [];
 // fill $scope.content with elements whose parent exist in $scope.cat (the parent list craeted above)
 categories.forEach(function(category) {
     if ($scope.cat.filter(function(cat) {
             return category.parentid === cat.id
         }).length > 0)
         $scope.content.push(category);
 });

sample plunk here

edited Aug 25, 2017 at 5:58

answered Aug 25, 2017 at 3:50

Sachet Gupta

8255 silver badges18 bronze badges

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

4 Comments

vivek Over a year ago

even i change categories[i].parentid i am getting same error

Sachet Gupta Over a year ago

@user7098427: I have updated my answer with the optimized code, have a look

vivek Over a year ago

i am getting undefined in my console if i use your code.could you please show me in plnkr

Sachet Gupta Over a year ago

i have updated my answer with sample plunk, have a look. I hope this helps you.

Jaie · Accepted Answer · 2017-08-25 04:47:32Z

0

Try something like this

replace

if($scope.cat[i].parentid == categories[i].id)
            {
                $scope.content.push(categories[i]);
            }

with

var res = $scope.cat.filter(function(item){
  return item.parentid === categories[i].id;
});

if(res.length)
{
    $scope.content.push(categories[i]);
}

edited Aug 25, 2017 at 4:47

answered Aug 25, 2017 at 3:57

Jaie

1371 silver badge9 bronze badges

1 Comment

Jaie Over a year ago

Try what I suggested added what u should replace, my only concern is you may need to use the filter to match up the content and cat arrrays with ids.

henrybbosa · Accepted Answer · 2017-08-25 05:19:42Z

0

You get undefined for $scope.cat[i] because the code that pushes to $scope.cat is not always executed even after correcting parentId to parentid

if(typeof categories[i] != "undefined" && categories[i].parentid == 0)
{
                $scope.cat.push(categories[i]);
}

for some values of the data array this condition will not be true. So nothing will be pushed to $scope.cat.

and remember your second if statement comes just after your first if statement. So sometimes you will not have $scope.cat[i]

for all these values the code will not be executed beacuse they dont pass the condition

{ id: 2, name: 'raj', parentid: 1 },
{ id: 3, name: 'ram', parentid: 1 },
{ id: 5, name: 'raju', parentid: 4 },       
{ id: 6, name: 'dinesh', parentid: 4 }

since parent id is not 0

So these are the values causing undefined

you can change to :

var categories = data;
    for(var i =0;i<=categories.length;i++)
    {
        if(typeof categories[i] != "undefined" && categories[i].parentid ==0)
        {
            $scope.cat.push(categories[i]);
        }

    }
    //you will already have you $scope.cat filled then loop through it 
    //checking with the categories array too.

    for(var j=0;j<$scope.cat.length;j++)
    {
       for(var k=0; k<categories.length; k++){
         if($scope.cat[j].parentid==categories[k].id)
         {
           $scope.content.push(categories[k]);
         }
       }
    }

or something like :

var categories = data;

categories = categories
.filter( (category)=>{
   return (category !== []._);  //removes all undefineds in the array
})
.map((category)=>{
  //checks each category from data if is parent_Id is 0 and pushes it to cats array
  //by the end of the operation. the cats array will have some data
  (category.parentId == 0)? ($scope.cats.push(category) , return ) : return;
})
var getContent =(cats,categories)=>{
  var content=[];
  for(var j=0;j<cats.length;j++)
  {
     for(var k=0; k<categories.length; k++){
       if(cats[j].parentid==categories[k].id)
       {
         content.push(categories[k]);
       }
     }
  }
  return content;
}
$scope.content = getContent($scope.cats,categories);

edited Aug 25, 2017 at 5:19

answered Aug 25, 2017 at 4:39

henrybbosa

1,12513 silver badges29 bronze badges

2 Comments

vivek Over a year ago

in this case i have two data in $scope.cat.so i want to compare only id of these two datas with parentid of remaining data

henrybbosa Over a year ago

remember your second if statement comes just after your first if stattement. So sometimes you will not have Scope.cat[i]

Collectives™ on Stack Overflow

comparing array of objects in angularjs

3 Answers 3

4 Comments

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

4 Comments

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related