Looking to display an array of object properties in an Angular view. Here is the object:
$scope._Json = {
"foo": {
"ItemDimension1": {
"Item": "item1",
"ItemIndex": 1,
"SelectedItems": [{
"Code": "Code1"
}]
}
},
"bar": {
"ItemDimension2": {
"Item": "item2",
"ItemIndex": 3,
"SelectedItems": [{
"Code": "code2"
}]
},
"ItemDimension3": {
"Item": "item3",
"ItemIndex": 2,
"SelectedItems": [{
"Code": "Code3"
}]
}
},
"Lorem": {
"ItemDimension4": {
"Item": "item4",
"ItemIndex": 5,
"SelectedItems": [{
"Code": "Code4"
}]
}
}
};
Desired view output should be:
item1 - 1
item3 - 2
item2 - 3
item4 - 5
However, current output is:
item4 - 5
item2 - 3
item3 - 2
item1 - 1
In the view template:
<label ng-repeat="(catagory, items) in _Json">
<li ng-repeat="(name, itemslist) in items | orderBy:'itemslist.ItemIndex'">
<strong>{{itemslist.Item }}</strong> - <strong>{{itemslist.ItemIndex }}</strong>
</li>
</label>
How can I order this by ItemIndex?
Is there a better approach or do I need to make changes?
I have tried using orderByobject as suggested here but it didn't work.
Check out the source on Plunker: