jeudi 1 janvier 2015

Loop through an array from JSON using Angular JS


I am trying to loop through an array from JSON and display the contents more like a side menu. I wrote something like





<ul ng-repeat="(key, value) in menuList.Menu">
<li>{{key}}</li>
<ul ng-repeat="(key, value) in value">
<li> {{key}}</li> //second key
<ul ng-repeat="(key, value) in value">
<li> {{key}}</li>
<ul ng-repeat="(key, value) in value">
<li> {{key}} : {{value}}</li>
</ul>
</ul>
</ul>
</ul>



The problem is my second key has both object and array. How do I display the value of Object and loop/ng-repeat just through the array. I cannot modify it with this as it will display the entire content of the array.



<li> {{key}} : {{value}}</li>


A part of my JSON for better understanding is given below:





{
"class": 99,
"mode" : 0,
"Menu": [{
"MenuNum": 1,
"MenuItems": [{
"ItemNum": 0,
"ItemDesc": "Main Menu",
"ActionCode": "-",
"ActionInst": ""
} , {
"ItemNum": 1,
"ItemDesc": "BBQ",
"ActionCode": "M",
"ActionInst": "0992"
}, {
"ItemNum": 2,
"ItemDesc": "Beverages",
"ActionCode": "M",
"ActionInst": "0992"
}]
},{
"MenuNum": 2,
"MenuItems": [{
"ItemNum": 0,
"ItemDesc": "Sub Menu",
"ActionCode": "-",
"ActionInst": ""
}, {
"ItemNum": 1,
"ItemDesc": "BBQTYPE1",
"ActionCode": "P",
"ActionInst": "0996"
}, {
"ItemNum": 2,
"ItemDesc": "BeveragesTYPE1",
"ActionCode": "P",
"ActionInst": "0998"
}]
}]
}



I want the sidebar more like


THIS





Aucun commentaire:

Enregistrer un commentaire