Extract values from JSON sub-arrays

Question

I want to populate an array ( $scope.children= [];) with all the children extracted from this array format (JSON data from a GET). Note that there is no top-level label.

[
  {
    "tenant_id": 38,
    "name": "Larry",
    "children": [
      "mike"
    ]
  },
  {
    "tenant_id": 89,
    "name": "Moe",
    "children": [
      "paul"
    ]
  },
  {
    "tenant_id": 95,
    "name": "Laurel",
    "children": null
  },
  {
    "tenant_id": 108,
    "name": "Mark",
    "children": [
      "louise"
    ]

  {
    "tenant_id": 39,
    "name": "Hardy",
    "children": [
      "trevor",
      "alison"
    ]
  }

]

And what are the issues you had when trying? For example using https://docs.angularjs.org/api/ng/function/angular.forEach — mplungjan, Jun 06 '15 at 15:37
Iterate over the array. See http://stackoverflow.com/questions/11922383/access-process-nested-objects-arrays-or-json — Felix Kling, Jun 06 '15 at 15:39
But the suggestions there were not angular, hence I did not close as dup — mplungjan, Jun 06 '15 at 15:50

Tim · Accepted Answer · 2015-06-06T15:56:33.670

0

Very simple, just use map function to return all the children data

//Return all the children 
data = data.map(function(item) {
    return item.children;
})

then in your Angular html you can do a nested view

<div ng-repeat="chilren in data"> 
    <label ng-repeat="item in chilren">{{item}}</label>
</div>

or the fastest way just use the angular ng-repeat

<div ng-repeat="item in data"> 
    <label ng-repeat="value in item.children">{{value }}</label>
</div>

edited Jun 06 '15 at 15:56

answered Jun 06 '15 at 15:42

Tim

3,585
3
34
57

That would not process the given JSON – mplungjan Jun 06 '15 at 15:42
What framework/JS version are you using? – mplungjan Jun 06 '15 at 15:45
I was hoping this would work on the HTML side
{{item.children}}
– user3760188 Jun 06 '15 at 15:46
@mplungjan i am using ES6 just now, just change to ES5 – Tim Jun 06 '15 at 15:46
Right, because chrome gave me error on ">". Now we get an array of arrays https://jsfiddle.net/mplungjan/jw2nungy/ - after fixing the JSON – mplungjan Jun 06 '15 at 15:49
@user3760188 just updated my answer with angular solution :) – Tim Jun 06 '15 at 15:57
Thanks Tim...i got lost iterating through nested arrays. "Map" was beyond simple! – user3760188 Jun 06 '15 at 16:56

Extract values from JSON sub-arrays

1 Answers1