How to loop json object in angularjs

Question

i'm using the tree component in my angular projet, i'm trying to loop a json object to populate the tree heres my code:

 var myData=[{"agence":"CTM","secteur":"Safi","serie":"CZC1448YZN"},{"agence":"CTM","secteur":"Safi","serie":"2UA13817KT"},{"agence":"CTM","secteur":"Safi","serie":"2UA13817KT"},{"agence":"CTM","secteur":"Essaouira","serie":"CZC1221B85"},{"agence":"CTM","secteur":"Essaouira","serie":"CZC1221B85"},{"agence":"Gare Routiere Municipale","secteur":"Essaouira","serie":"CZC145YL3"},{"agence":"Gare Routiere Avenue des FAR CTM","secteur":"Casablanca","serie":"2AU2290Y48"},{"agence":"Gare Routiere Avenue des FAR CTM","secteur":"Casablanca","serie":"2AUD14404X"}];
    for(var i=0; i < myData.length; i++) {
       // alert('roro '+myData[i].secteur);
        treedata_avm = [{
            label: myData[i].secteur,
            children: [{
                label: myData[i].agence,
                children: [myData[i].serie]
            }]
        }];
    }

My problem is, i got only the last line in the json object which is {"agence":"Gare Routiere Avenue des FAR CTM","secteur":"Casablanca","serie":"2AUD14404X"}

how i can get all the data displayed in the tree???

use angular.forEach(jsonObject, function(singleObject,key){ //logic }) — gaurav bhavsar
– gaurav bhavsar, Commented Dec 30, 2016 at 10:12

Supradeep · Accepted Answer · 2016-12-30 10:17:23Z

1

You are replacing the previous value in treedata-avm instead of adding the new one into it. What you can do is, define an empty array treedata_avm and push each object in myData into it by iterating which you are already doing.

var myData=[{"agence":"CTM","secteur":"Safi","serie":"CZC1448YZN"},{"agence":"CTM","secteur":"Safi","serie":"2UA13817KT"},{"agence":"CTM","secteur":"Safi","serie":"2UA13817KT"},{"agence":"CTM","secteur":"Essaouira","serie":"CZC1221B85"},{"agence":"CTM","secteur":"Essaouira","serie":"CZC1221B85"},{"agence":"Gare Routiere Municipale","secteur":"Essaouira","serie":"CZC145YL3"},{"agence":"Gare Routiere Avenue des FAR CTM","secteur":"Casablanca","serie":"2AU2290Y48"},{"agence":"Gare Routiere Avenue des FAR CTM","secteur":"Casablanca","serie":"2AUD14404X"}]; 

var treedata_avm = [];

for(var i=0; i < myData.length; i++) {
   // alert('roro '+myData[i].secteur);
    treedata_avm.push({
        label: myData[i].secteur,
        children: [{
            label: myData[i].agence,
            children: [myData[i].serie]
        }]
    });
}
console.log(treedata_avm);

edited Dec 30, 2016 at 10:17

answered Dec 30, 2016 at 10:12

Supradeep

3,2661 gold badge18 silver badges28 bronze badges

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

6 Comments

Supradeep Over a year ago

It's working fine. Copy and paste the same code in browser console and check please.

user7035864 Over a year ago

please..another question...i got a duplicate data in my tree..is there a way to group by secteur in the json object

Supradeep Over a year ago

You can check for the duplicates in the loop avoid pushing it into the array or for a simpler solution , use lodash library which has a many methods to these kind of operations lodash.com/docs/4.17.2#uniq

user7035864 Over a year ago

no..i will lose that like that..i want to group by secteur in my json object..this is exactly what i want help please..

Supradeep Over a year ago

Then you can use _.groupBy method

|

苏理煌 · Accepted Answer · 2016-12-30 10:13:28Z

 var myData=[{"agence":"CTM","secteur":"Safi","serie":"CZC1448YZN"},{"agence":"CTM","secteur":"Safi","serie":"2UA13817KT"},{"agence":"CTM","secteur":"Safi","serie":"2UA13817KT"},{"agence":"CTM","secteur":"Essaouira","serie":"CZC1221B85"},{"agence":"CTM","secteur":"Essaouira","serie":"CZC1221B85"},{"agence":"Gare Routiere Municipale","secteur":"Essaouira","serie":"CZC145YL3"},{"agence":"Gare Routiere Avenue des FAR CTM","secteur":"Casablanca","serie":"2AU2290Y48"},{"agence":"Gare Routiere Avenue des FAR CTM","secteur":"Casablanca","serie":"2AUD14404X"}];

var treedata_avm = [];
for(var i=0; i < myData.length; i++) {
   // alert('roro '+myData[i].secteur);
    treedata_avm.push({
        label: myData[i].secteur,
        children: [{
            label: myData[i].agence,
            children: [myData[i].serie]
        })
    }];
}

you should use array function 'push' to push the object to the new array; but not use the '=';

Avnesh Shakya · Accepted Answer · 2016-12-30 10:13:50Z

0

Try this:

var treedata_avm = [];
for (var i = 0; i < myData.length; i++) {
    treedata_avm.push({
        label: myData[i].secteur,
        children: [{
            label: myData[i].agence,
            children: [myData[i].serie]
        }]
    });
}

Using .push(). will work for you.

answered Dec 30, 2016 at 10:13

Avnesh Shakya

3,9162 gold badges25 silver badges32 bronze badges

Comments

Peter Grainger · Accepted Answer · 2016-12-30 10:17:06Z

0

You can also use the map function, which is functional and a little less error prone https://developer.mozilla.org/pl/docs/Web/JavaScript/Referencje/Obiekty/Array/map

var treedata_avm = myData.map(function(value) {
    return {
        label: myData[i].secteur,
        children: [{
            label: myData[i].agence,
            children: [myData[i].serie]
        }]
    }
})

answered Dec 30, 2016 at 10:17

Peter Grainger

5,2602 gold badges20 silver badges22 bronze badges

Collectives™ on Stack Overflow

How to loop json object in angularjs

4 Answers 4

6 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

6 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related